Markdown 样式美化大全

Markdown 样式大全

目录

1. 键盘

A

<kbd>Backspace</kbd>

2. 路径

/usr/local/nginx/sbin/nginx

<span style="color:#4185c4;">/usr/local/nginx/sbin/nginx</span>

3. 彩色字体背景

Nginx is not running !

<b style="color:red;">Nginx&nbsp;is&nbsp;not&nbsp;running&nbsp;!</b>

Nginx is running !

<b style="color:green;">Nginx&nbsp;is&nbsp;running&nbsp;!</b>

 Nginx is running ! 

<b style="background-color:green;color:white;"> Nginx is running ! </b>

4. 折叠

展开查看内容 这是展开后的内容。
<details>
 <summary>展开查看内容</summary>
 这是展开后的内容。
</details>

5. 锚点链接

在 Typora 中,按住Ctrl+鼠标左键 进行跳转。

  • Markdown 原始写法 [名称](#id)

    原生锚点1

    原生锚点2

    跳转到原生锚点1
    跳转到原生锚点2

    ### 原生锚点1
    
    ### 原生锚点2
    
    [跳转到原生锚点1](#原生锚点1)
    [跳转到原生锚点2](#原生锚点2)
    

    如果有重复的标题,从 开始添加编号后缀-1,例如:

    Hello

    ...

    Hello

    ...

    A link to first header, a link to second one.

    # Hello
    
    ...
    
    # Hello
    
    ...
    
    A [link](#hello-1) to first header, a [link](#hello-2) to second one.
    
  • HTML 语法 <a href="#id">名称</a>

    titleA

    titleB

    to titleA
    to titleA

    <h3 id="titleA">titleA</h3><h3 id="titleB">titleB</h3>[to titleA](#titleA)[to titleA](#titleB)
    

6. 待办列表

    • [ ] 记得找个女朋友
    • [ ] 天凉了,记得加衣喔
      • [x] 今日份单词打卡
      • [x] 了解tree shaking和dce
1. - [ ] 记得找个女朋友2. - [ ] 天凉了,记得加衣喔   1. - [x] 今日份单词打卡   2. - [x] 了解tree shaking和dce

7. 脚注

你好[1]

你好[^脚注][^脚注]: 这是一个脚注

8.自定义列表

Markdown 样式美化大全

Credits: John: MikeUI Designer: Xiao Ming

Typora 暂不支持。

9. 复杂表格

Markdown 绝大多数编辑器都是支持 html 语言,Markdown 本身不支持复杂的表格,所以使用 html 来编辑即可。

  • 使用跨行或者跨列时,使用 th 标签
  • 跨行: rowspan 的的参数就是要跨的行数
  • 跨列: colspan 的参数就是要跨的列数
真实情况 预测结果
正例 反例
正例 TP(真正例) FN(假反例)
反例 FP(假正例) TN(真反例)
<table align="center">
    <tr>
        <th rowspan="2">真实情况</th>
        <th colspan="2">预测结果</th>
    </tr>
    <tr>
        <td>正例</td>
        <td>反例</td>
    </tr>
    <tr>
        <td>正例</td>
        <td>TP(真正例)</td>
        <td>FN(假反例)</td>
    </tr>
    <tr>
        <td>反例</td>
        <td>FP(假正例)</td>
        <td>TN(真反例)</td>
    </tr>
</table>

10. 文本高亮

…… 海森堡在 1927 年首先提出 ……

…… <mark>海森堡在 1927 年首先提出</mark> ……

注意:文档编写使用的是 Typora,部分效果博客园未支持。


  1. 这是一个脚注 ↩︎

上一篇:Lesson18:HTML


下一篇:ASP.NET相关技术整理