热门关键字:
jquery > jquery教程 > jquery教程 > Obsidian自定义样式修改教程

Obsidian自定义样式修改教程

242
作者:管理员
发布时间:2021/8/9 19:10:11
评论数:0
转载请自觉注明原文:http://www.jq-school.com/Show.aspx?id=5252
  什么是markdown什么是HTML什么是CSS


  Markdown是一种可以使用普通文本编辑器编写的标记语言,通过简单的标记语法,它可以使普通文本内容具有一定的格式。obsidian使用的是扩展的markdown格式。


  超文本标记语言(HyperText Markup Language,HTML)是构成 Web 世界的一砖一瓦。它定义了网页内容的含义和结构。我们熟悉的网页都是由HTML构成的。以下列举了几种markdown转换为HTML的对应格式:


  层叠样式表(Cascading Style Sheet,CSS)是用于控制网页样式的标记性语言。在obsidian中,markdown被解析成HTML,因此需要使用CSS修改其显示样式。  CSS类似于Microsoft Office Word中的“样式”功能。


  obsidian的CSS存放位置在笔记库文件夹下的和这两个文件夹。主要放置主题CSS文件,而主要放置CSS片段。


  CSS基本使用方法


  基础语法变量编辑软件准备


  CSS是定义HTML中特定元素样式的一组规则,比如“我希望页面中的一级标题的红色的字”,对应的CSS代码如下:


  语法由一个 起头。 它"选择"了我们将要用来添加样式的 HTML 元素。 在这个例子中我们为一级标题(主标题)添加样式。


  接着输入一对大括号{ }。 在大括号内部定义一个或多个形式为  的 声明。每个声明都指定了我们所选择元素的一个属性,之后跟一个我们想赋给这个属性的值。冒号之前是属性,冒号之后是值。不同的 CSS 属性对应不同的合法值。


  CSS选择器有如下几个常见的类型: - 标签选择器 - 类选择器 - id选择器 - 分组选择器 - 后代选择器 - 父子选择器 - 兄弟选择器 - 属性选择器 - 根据状态确定样式


  通过HTML标签进行选择,比如等标签。


  通过标签的class类进行选择,比如等类。


  通过标签的id进行选择,比如等id。obsidian中貌似用不到id选择器(?待确认)


  选择器可以一次选择多种元素设置相同的样式,少写了很多代码。不同选择器使用逗号分隔。


  又称为包含选择器,选择某个标签的所有后代以设置样式,比如div内的ul内的li元素,每一层选择器之间使用空格分隔


  类似于后代选择器,但是有点不同。如果您不希望选择任意的后代元素,而是希望缩小范围,只选择某个元素的子元素,请使用父子元素选择器。


  也叫关联选择器,用来选择紧挨着的元素的选择器,比如希望选择h1元素下面第一个段落p,而不选择第二个段落p以后的元素。


  通过属性(如name属性)进行选择以设置相同的样式


  对于链接可根据它的不同状态分别设置不同的样式,如是否是未访问的、访问过的、被鼠标悬停的等状态。


  对于重复使用的属性值,可以将其设置成变量,便于统一修改,不必一遍又一遍地复制和粘贴相同的属性值。此外,采用合理的变量名,能让其他人一眼就能识别该属性值的作用。如和


  本地编辑CSS代码的软件推荐使用vscode


  为了方便调试,按打开chrome调试工具如下图所示


  点击该按钮后,鼠标移动到你想修改的对象上就可以查看该元素的CSS属性值,不仅可以看到正在生效的属性,还可以看到被覆盖掉的属性值。 使用vscode编辑css代码,保存后自动生效,记得在obsidian设置“外观”中选择你所编辑的主题。


  下面开始实战讲解。由于目前obsidian还未做到所见即所得,窗口分为编辑模式与预览模式,因此CSS样式也要分别为这个两个不同的模型写代码。编辑模式对应类,以及缩写的等类。预览模式对应。下面针对两种模式分别进行讲解。


  标题代表第x级标题。


  引用文本


  列表,其中第x级标题为


  具体分别指定有序列表和无序列表使用和


  链接


  斜体加粗


  标题代表第x级标题。


  引用文本


  列表,其中第x级标题为


  具体分别指定有序列表和无序列表使用和


  链接


  斜体加粗


  字体字号颜色背景颜色缩进行距页面宽度


  字体分为本地字体和网络字体。注意:一般字体都需要收费,自己个人免费用没事,一旦涉及商业用途需要收费。 将网络上的字体下载并安装后,直接使用字体的名字即可,可同时设置多个字体,系统从最左边开始使用,找不到该字体会顺延至下一个字体。


  也可以根据网址引用网络字体


  字号有很多种单位:px像素,pt磅和em相对字体大小


  找到你想修改的那部分元素,修改它的color属性值。


  背景颜色同理,


  或者修改color相关的变量


  修改text-indent属性即可。 编辑模式


  预览模式


  修改line-height属性即可


  分别修改编辑模式和预览模式的max-width属性。obsidian默认是700px




如果您觉得本文的内容对您的学习有所帮助:支付鼓励



关键字:jquery
友荐云推荐