教程推荐
一、markdown标签(高频通用语法):
基本满足撰写排版需求
- 标题
# 一级标题
## 二级标题
### 三级标题
(1空格) - 引用
>
(1空格) - 有序列表
1.
(1空格) - 无序列表
-
(1空格) - 分割线
---
(前后都要空 1行) - 表格
| ti | name | num |
(Obsidian的Table Enhancer插件可右键创建) - 图片
![图片注释](link)
- 外部链接 浮光河
[浮光河](https://fgggh.cn/)
- 粗体
**粗体**
- 粗斜体
***粗斜体***
- 斜体
*斜体*
删除线~~删除线~~
代码
`代码`
- 高亮
==高亮==
1、段落
- 同段内换行:①两个空格 + 回车;②使用
<br>
标签。 - 分段:两个回车,即前后段之间要有一个空行。
分段示例
❖ 效果 ❖
Le vent se lève !… Il faut tenter de vivre !
L’air immense ouvre et referme mon livre,
La vague en poudre ose jaillir des rocs !
——Le cimetière marin
❖ 写法 ❖
Le vent se lève !… Il faut tenter de vivre !
L’air immense ouvre et referme mon livre,<br>La vague en poudre ose jaillir des rocs !
——Le cimetière marin
- 引用:可嵌套引用。引用块里要用一个引用的单独行来分段。
- 列表:类似大纲。
- 列内换行:①以==4空格或一个Tab==为单位缩进层级,同层级缩进相同;②一个
<br>
标签。 - 列内嵌套其他元素(引用、代码块、图片……):以==4空格或一个Tab==为单位缩进层级,同层级缩进相同
- 有序列表的同一层级,只要起始列数字是 1,不论后几列数字是啥都可以渲染成自然数顺序,故毋须专门对数字排列。
- 列内换行:①以==4空格或一个Tab==为单位缩进层级,同层级缩进相同;②一个
- 代码块:首行可以定义代码语言。
代码块内不能嵌套代码块。
在代码块里显示反引号`
要用一层反引号包裹。
缩进嵌套:标题、引用、有序列表、无序列表均可以使用缩进嵌套,因为从 markdown 标签结构来看它们其实是同类。
(最后强调)缩进一层级:①4 个半角空格;②一个Tab。
嵌套示例
❖ 效果 ❖
引用:
Le vent se lève !… Il faut tenter de vivre !【注意嵌套引用】
L’air immense ouvre et referme mon livre,
La vague en poudre ose jaillir des rocs !–Le cimetière marin
列表【注意嵌套标题】
- 有序列表:
- 周氏岗山笔庄狼勾;
- 大明笔庄古法纯狼;
- 藝雲筆莊鐵線神勾。
列表:
- 道可道,非常道;
可以言说的道理,就不是永恒不变的道理。【注意列内嵌套引用块】
- 名可名,非常名。
无,名天地之始;有,名万物之母。【注意列内换行】 - 故常无,欲以观其妙;常有,欲以观其徼。【注意有序列表数字】
- 常用毛笔
- 汉笔坊
- 兼毫手札二号
兼毫书画【注意列内换行】尝试。【注意列内嵌套代码块,缩进4层级】
- 兼毫手札二号
- 汉笔坊
在代码块里显示反引号:
`尝试。
❖ 写法 ❖
引用:
> > Le vent se lève !… Il faut tenter de vivre !【注意嵌套引用】
> L’air immense ouvre et referme mon livre,
> La vague en poudre ose jaillir des rocs !
>
> --*Le cimetière marin*
>
> #### 列表【注意嵌套标题】
> - 有序列表:
> 1. 周氏岗山笔庄狼勾;
> 1. 大明笔庄古法纯狼;
> 8. 藝雲筆莊鐵線神勾。
列表:
1. 道可道,非常道;
> 可以言说的道理,就不是永恒不变的道理。【注意列内嵌套引用块】
8. 名可名,非常名。<br>无,名天地之始;有,名万物之母。【注意列内换行】
0. 故常无,欲以观其妙;常有,欲以观其徼。【注意有序列表数字】
1. 常用毛笔
- 汉笔坊
- 兼毫手札二号
兼毫书画【注意列内换行】
```txt
尝试。【注意列内嵌套代码块,缩进4层级】
```
在代码块里显示反引号:
````md
`尝试。
````
2、图片
写法:
- ✔md 标签:
![浮云晕染](https://images.unsplash.com/photo-1587476821668-7e1391103e49?w=500)
- HTML 标签:
<img src='https://images.unsplash.com/photo-1587476821668-7e1391103e49?w=500' alt='浮云晕染'>
图片链接(本质是套娃)
- ✔md 标签:
[![浮云晕染](https://images.unsplash.com/photo-1587476821668-7e1391103e49?w=500 "链接标题,选填")](https://markdown.com.cn)
- HTML 标签:
<a href="https://markdown.com.cn"><img src="https://images.unsplash.com/photo-1587476821668-7e1391103e49?w=500" alt="浮云晕染" title="链接标题,选填"></a>
二、HTML标签(低频通用语法):
提高效率,可用 VS Code 正则表达式匹配搜索替换:
vscode常用正则表达式搜索(跨行搜索包含的特定字符串)
vscode搜索正则匹配 - CSDN,VsCode搜索替换正则表达式的使用 - CSDN
例:
- 匹配
第(\d+)章
,全部替换为# 第$1章
。 - 贪婪匹配以
☆、
开头的整行:☆、.*
- 匹配空行:
^\s*\n
以下 HTML 标签只有技术文才用
(也不能用太多,主要是输入麻烦且不简洁且修改时会耽于排版)
- 小字
<small>小字</small>
(只是为了美观直观) - 按键Ctrl
<kbd>Ctrl</kbd>
(只是为了美观直观) - 换行:
<br>
(可以不用担心格式不对,表格内换行用) - ✖文章内部链接:markdown 中如何插入一个指向本文其他部分的链接?
1、段落
✔折叠:
<details><summary>标题</summary>内容</details>
(内容部分可换行分段)折叠示例
写法(标题行与换行分段内容之间一定要空一行):为什么要用 HTML 标签?
MarkDown 基本语法方便但有不足:能满足基础写作格式,但无法使用折叠语法,无法配置颜色等更多拓展样式。md 文件最终是要转成 html 文件(渲染)的,所以 markdown 语法就是应简化 html 标签、提高网页内容创作效率而生的。
因此,使用 html 语法能实现更多情景下的创作。而且,html 标签是通用格式,多数情况下都能正常渲染。
一句话:markdown 写作支持嵌入 html 标签。
<details><summary>为什么要用HTML标签?</summary> MarkDown 基本语法方便但有不足:能满足基础写作格式,但无法使用折叠语法,无法配置颜色等更多拓展样式。md 文件最终是要转成 html 文件(渲染)的,所以 markdown 语法就是应简化 html 标签、提高网页内容创作效率而生的。 因此,使用 html 语法能实现更多情景下的创作。而且,html 标签是通用格式,多数情况下都能正常渲染。 一句话:markdown 写作支持嵌入 html 标签。 </details>
✔控制表格列宽:Markdown 技巧:如何改变表格宽度(列宽)?
标签写法:在表格之前添加下面这个标签(会应用到本文内所有表格)。<style> table th:first-of-type { width: 18%; } </style>
首行缩进:首行一定要用
 
,后面可以用全角空格首行缩进示例
效果:
现在我终于知道拉普达为什么会灭亡。
灭亡的原因就写在肯特亚山谷的歌词里:‘根要扎在土壤里,和风一起生存,和竹子一起过冬,和鸟儿一起歌颂春天。’不管你拥有多么惊人的武器,不管你操纵多少可怜的机器人,只要离开土地,就没有办法生存!写法:
  现在我终于知道拉普达为什么会灭亡。 灭亡的原因就写在肯特亚山谷的歌词里:‘根要扎在土壤里,和风一起生存,和竹子一起过冬,和鸟儿一起歌颂春天。’不管你拥有多么惊人的武器,不管你操纵多少可怜的机器人,只要离开土地,就没有办法生存!
2、字体样式
本库使用 | 字符格式 | html 写法 | 渲染效果 |
---|---|---|---|
✔ | 小字 | <small>小型文本</small> | 小型文本 |
✔ | 按键 | <kbd>Ctrl</kbd>+<kbd>F9</kbd> | Ctrl+F9 |
下划线 (同字体色) | <u>浮光河</u> 流淌在心底。 | 浮光河流淌在心底。 | |
荧光笔 | <mark style="background-color: AliceBlue">浮光河</mark> 流淌在心底。 | 浮光河流淌在心底。 | |
字顶标注 | <ruby>光<rt>明也。</rt></ruby> | 光 | |
上标下标 | 光<sup>『說文解字』</sup> H<sub>2</sub>O | 光『說文解字』 H2O | |
字体 颜色 大小 | <font color=#d0dfe6 size=6>浮光河</font> <font face="微软雅黑" color="blue" size="3">流淌在心底。</font> | 浮光河 流淌在心底。 | |
不渲染 markdown 符号 | 在会转义的符号前加 \ :\*\*正常显示星号\*\**\~撒花\~~ | ** 正常显示星号***~撒花~~ |
三、插件 markdown 标签(扩展语法):
本库使用 | 字符格式 | 插件 markdown 写法 | 通用 html 标签 | 渲染效果 |
---|---|---|---|---|
✔ | 荧光笔 | ==mark== | mark:<mark style='background-color:rgba(255, 241, 187, .6)'>mark</mark> | mark |
下划线 | ++Inserted++ | ins:<ins>Inserted</ins> | Inserted | |
下标 | H~2~0 | sub:H<sub>2</sub>0 | H20 | |
上标 | x^2^ | sup:x<sup>2</sup> | x2 | |
数学公式 KateX | Katex,referer | |||
正文目录 toc | 输入 @[toc] 生成标题目录。 | toc&anchor |
✔脚注/参考文献
为Hexo博客添加脚注插件:markdown-it-footnote
这里有一个脚注参考文献,[^🤍] 还有另一个脚注。[^0]
这个也是脚注[^look]【注意有1空格】
[^0]:这是多段脚注。【注意是英文冒号+1半角空格】
后面的段落缩进两个<kbd>Tab</kbd>,以显示它们属于前一个脚注。
[^🤍]: 这是脚注.【注意多段脚注后要有1空行】
[^look]: 单行脚注可不用空行
✖双向链接、嵌入附件(Obsidian 专用)
- ⚠非通用语法:
- 文内跳转:
[[#文内的标题]]
- 转到某篇文章:①
[[某文标题]]
②左侧栏搜索后将结果拖入文中 - 转到某段内容:① 键入
[[^^
检索文段,选中后自动转为链接 ②[[某文#某标题|显示文字]]
- 某段引用到文中(嵌入):①键入
![[^^
检索文段,选中后自动转为引用 ②![[某文#某标题|显示文字]]
- 支持图片、PDF、文档、表格、PPT、音频、视频等各种文件:
![[文件路径]]
- 设置文件大小:
![[文件路径|数字×数字]]
- 文内跳转:
附:markdown 渲染配置
插件和渲染器的区别:
插件一般对单种功能或样式进行支持,渲染器是工作引擎。添加安装插件就是对默认 markdown 渲染器的锦上添花;选择其他 markdown 渲染器就要先卸载默认渲染器。
可选方案
拓展插件:
不同的 markdown-it 渲染器一般都支持自行安装其他 markdown-it
插件。
插件获取途径:
- 到 npmjs官网 里搜索关键词
keywords:markdown-it-plugin
或👉直达链接 - markdown-it专页
其他渲染器:
- markdown-it中文文档
- 解决hexo-renderer-kramed渲染冲突的部分问题
✖hexo-renderer-markdown-it:渲染快,功能丰富,支持复杂的数学公式 KateX(但要自行设置),支持插件扩展。教程:將Hexo的Markdown渲染引擎換成markdown-it。因为支持脚注选择了它。因为渲染后目录链接要设置锚点才有点击跳转,又觉得正文标题渲染太累赘,加上不想鼓捣,遂弃用。
✔@upupming/hexo-renderer-markdown-it-plus插件:配置教程。现用方案。
hexo-renderer-markdown-it插件配置代码参考
# Markdown-it config https://github.com/celsomiranda/hexo-renderer-markdown-it/wiki markdown: # 渲染设置 render: html: true # true时不转义html内容,标签显示为html;false时html内容转义成普通字符串 xhtmlOut: false # 是否生成与XHTML完全兼容的标签Parser will not produce XHTML compliant code breaks: true # true时每个换行符都被渲染成一个<br>(即Hexo的默认表现);false时只有空行才会被渲染为<br>(GFM的默认表现) linkify: true # 是否自动识别链接并把它渲染成链接 typographer: true # 是否自动识别印刷格式(意思是把(c)渲染为©这样的) quotes: '“”‘’' # 如果typographer被设置为true,则该选项用于设置将dumb quotes("")自动替换为smart quotes plugins: # 设置所需插件 - markdown-it-footnote - markdown-it-ins anchors: # 锚点设置 level: 1 # 创建 ID 的最低级别(例如 h2 到 h6) collisionSuffix: 'v' #如果 ID 重复,则在给定数字前加上一个后缀 permalink: true #true时在标题旁创建一个带有永久链接的锚标记 permalinkClass: header-anchor #用于永久链接锚标记的类 permalinkSymbol: '' #¶永久链接的符号