Skip to content

📒 Markdown语法记录

标签
markdown
md
语法
字数
2502 字
阅读时间
10 分钟

因为不经常用,时长忘记语法,做个记录贴~

元数据

可以在文件头填写以上内容来增加标签等信息

markdown
---
tags:
  - markdown
  - md
  - 语法
---

提示(自定义容器)

markdown
::: info 后果须知

请注意,如果你需要使用 HSBC HK 的电子账单或者账单作为英文地址的证明
请再三思考后再决定是否需要这样修改,因为修改之后想要删除或者变更为英文地址的时候就只能通过寄信说明或者线下前往 HSBC HK 并在柜台完成修改地址的操作了。

:::

效果示例

后果须知

请注意,如果你需要使用 HSBC HK 的电子账单或者账单作为英文地址的证明,请再三思考后再决定是否需要这样修改,因为修改之后想要删除或者变更为英文地址的时候就只能通过寄信说明或者线下前往 HSBC HK 并在柜台完成修改地址的操作了。

可以使用 infotipdangerwarningdetails来设置样式 可以通过在容器的 "type" 之后附加文本来设置自定义标题。

点击查看

点击查看内部信息

块引用

markdown
> 您准备好保安编码器或流动保安编码,然后按照以下步骤更改您的中文通讯地址:
>
> - 登录网上理财
> - 在主页顶部选单选择“理财”
> - 在“个人设置”下选择“更新个人资料”
> - 在左边菜单栏选择“更新中文通讯地址(只限于中国内地或台湾)”

示例

您准备好保安编码器或流动保安编码,然后按照以下步骤更改您的中文通讯地址:

  • 登录网上理财
  • 在主页顶部选单选择“理财”
  • 在“个人设置”下选择“更新个人资料”
  • 在左边菜单栏选择“更新中文通讯地址(只限于中国内地或台湾)”

内置Markdown扩展

详情查看 VitePress官方介绍

包含,代码块中的语法高亮,在代码块中实现行高亮,代码块中聚焦,代码块中的颜色差异,高亮“错误”和“警告”,行号,代码组,包含 markdown 文件,数学方程,图片懒加载,高级配置及其他扩展的使用方法

双向链接

双向链接 (也被称之为内部链接,英文 Bi-directional links 和 Internal links),和也许你也了解和听说过另一个有关的概念 WikiLinks,在文档工程中有着非常重要的地位,它通常用于快速的建立一个页面到另一个页面的连接(或者链接),在 Wikipedia 这样的 Wiki 框架中,以及现在所流行的 ObsidianLogseq 中都被广泛使用。

这个插件是 Obsidian内部链接的全功能兼容实现版本,它遵循两条规则:

  1. 一个页面的文件名称(不包含扩展名)可以作为一个链接的目标,例如:[[双向链接示例页面]] 将会被解析为一个指向全局唯一的 双向链接示例页面.md 文件的链接。
  2. 一个链接的目标可以是一个绝对路径,例如:[[某个文件夹/双向链接示例页面]] 将会被解析为一个指向 某个文件夹/双向链接示例页面.md 的链接,通常出现在你有多个同名文件的时候。

详情查看 Markdown It 插件

语言块

markdown
```markdown
输入语言内容
```

示例

shell
sudo lsof /var/lib/dpkg/lock-frontend

vue组件

AppContainer

html
<AppContainer href="https://github.com/nolebase/nolebase" hideBy>
  <template #image>
    <img src="/android-chrome-192x192.png" />
  </template>
  <template #name>
    Nólëbase
  </template>
  <template #by>
    以 Nólëbase 为名,读作 nole-base,取自意为「知识」的昆雅语 nólë 和意为「基础」的英文 base,即「知识库」
  </template>
</AppContainer>

使用示例

Nólëbase
by 以 Nólëbase 为名,读作 nole-base,取自意为「知识」的昆雅语 nólë 和意为「基础」的英文 base,即「知识库」
View
html
<Gallery title="SPY x FAMILY 間諜家家酒" creator="遠藤達哉" href="https://ani.gamer.com.tw/animeVideo.php?sn=28798" linkText="前往观看" disableNewline>
  <template #image>
    <img src="./🪄ACG/🎞️动画/assets/2022-间谍家家酒.jpg" />
  </template>
   <template #describe>
每一个人都拥有不想让任何人看见得自己的一面―― 位在世界各国于台面下进行激烈情报战的时代。东国与西国已经维持了数十年的冷战状态。所属西国情报局对东课WISE 厉害的间谍〈黄昏〉,为了前往找寻被誉为是会威胁到东西国和平的危险人物,东国的国家统一党总裁唐纳文・戴斯蒙德所正在筹备的战争计画,被赋予了一项极秘任务。其名称为 Operation〈枭〉。内容讲述「在一周内组建家庭,并潜入戴斯蒙德儿子所就读的学校吧」。但是,他所遇到的「女儿」是会读心的超能力者、「妻子」则是暗杀者!为了互相的利益而成为家庭,决定在隐藏真实身分的情况下共同生活的 3 人。世界的和平就托付即将发生一系列事件的暂定的家庭…?
   </template>
</Gallery>

TIP

大部分的插槽prop都有对应的同名属性,比如image插槽, 可以直接传递image属性到根组件
但是所有的属性都写到一行会导致很难修改和阅读,所以使用插槽扩展到多行

disableNewline: 默认为false, 是否将空格转为换行符, 由于SFC的编译行为会将换行符转为空格, 导致回车换行符失效
如文本内确实需要显示空格, 可以启用该选项。然后显式使用<br>换行符换行

SPY x FAMILY 間諜家家酒遠藤達哉
每一个人都拥有不想让任何人看见得自己的一面―― 位在世界各国于台面下进行激烈情报战的时代。东国与西国已经维持了数十年的冷战状态。所属西国情报局对东课WISE 厉害的间谍〈黄昏〉,为了前往找寻被誉为是会威胁到东西国和平的危险人物,东国的国家统一党总裁唐纳文・戴斯蒙德所正在筹备的战争计画,被赋予了一项极秘任务。其名称为 Operation〈枭〉。内容讲述「在一周内组建家庭,并潜入戴斯蒙德儿子所就读的学校吧」。但是,他所遇到的「女儿」是会读心的超能力者、「妻子」则是暗杀者!为了互相的利益而成为家庭,决定在隐藏真实身分的情况下共同生活的 3 人。世界的和平就托付即将发生一系列事件的暂定的家庭…?
前往观看

Markdown原生语法

这里只只列出一些常用的

字体外观

markdown
*斜体文本*
**粗体文本**
***粗斜体文本***
~~删除线文本~~

斜体文本
粗体文本
粗斜体文本
删除线文本

超链接

markdown
[mermaid-js/mermaid](https://github.com/mermaid-js/mermaid)

示例 mermaid-js/mermaid

图片

markdown
![](./image.jpg)

表格

markdown
| 文档状态 | 命令 | 简介 |
| --------- | ----| ----- |
| 正常 | [[cd 变更目录]] | 变更当前 **工作目录** 的位置 |
| 正常 | [[cp 复制]] | 把文件复制到别的地方 |

示例

文档状态命令简介
正常cd 变更目录变更当前 工作目录 的位置
正常cp 复制把文件复制到别的地方

脚注

markdown
这意味着开源协议允许商业使用和衍生作品[^1]
[^1]: https://www.oshwa.org/2014/05/21/cc-oshw/
[^2]: https://opensource.org/osd/
[^3]: https://opendefinition.org/od/2.1/en/

水平线

markdown
---

通常用于分割一些段落

列表

Markdown 支持有序列表和无序列表, 并且可以进行互相嵌套

有序列表

有序列表使用数字并加上 . 号来表示,如:

markdown
1. 项目1
2. 项目2
  1. 项目1
  2. 项目2

无序列表

无序列表使用星号(*)、加号(+)或是减号(-)作为列表标记,这些标记后面要添加一个空格,然后再填写内容:

markdown
- 项目1
- 项目2
  - 子项目1
  - 子项目2
  • 项目1
  • 项目2
    • 子项目1
    • 子项目2

嵌套列表

列表嵌套只需在子列表中的选项前面添加两个或四个空格即可:

markdown
1. 第一项:
    - 第一项嵌套的第一个元素
    - 第一项嵌套的第二个元素
2. 第二项:
    - 第二项嵌套的第一个元素
    - 第二项嵌套的第二个元素
  1. 第一项:
    • 第一项嵌套的第一个元素
    • 第一项嵌套的第二个元素
  2. 第二项:
    • 第二项嵌套的第一个元素
    • 第二项嵌套的第二个元素

贡献者

页面历史

撰写

布局切换

调整 VitePress 的布局样式,以适配不同的阅读习惯和屏幕环境。

全部展开
使侧边栏和内容区域占据整个屏幕的全部宽度。
全部展开,但侧边栏宽度可调
侧边栏宽度可调,但内容区域宽度不变,调整后的侧边栏将可以占据整个屏幕的最大宽度。
全部展开,且侧边栏和内容区域宽度均可调
侧边栏宽度可调,但内容区域宽度不变,调整后的侧边栏将可以占据整个屏幕的最大宽度。
原始宽度
原始的 VitePress 默认布局宽度

页面最大宽度

调整 VitePress 布局中页面的宽度,以适配不同的阅读习惯和屏幕环境。

调整页面最大宽度
一个可调整的滑块,用于选择和自定义页面最大宽度。

内容最大宽度

调整 VitePress 布局中内容区域的宽度,以适配不同的阅读习惯和屏幕环境。

调整内容最大宽度
一个可调整的滑块,用于选择和自定义内容最大宽度。

聚光灯

支持在正文中高亮当前鼠标悬停的行和元素,以优化阅读和专注困难的用户的阅读体验。

ON开启
开启聚光灯。
OFF关闭
关闭聚光灯。

聚光灯样式

调整聚光灯的样式。

置于底部
在当前鼠标悬停的元素下方添加一个纯色背景以突出显示当前鼠标悬停的位置。
置于侧边
在当前鼠标悬停的元素旁边添加一条固定的纯色线以突出显示当前鼠标悬停的位置。