Markdown格式备注

好的文档不仅要内容精湛,更要格式优雅。

基本格式就不介绍了,主要备忘一些特殊格式。对,肯定不全面,慢慢完善嘛。。。

表格设置

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
<style>
table
width: 100%; /*表格宽度*/
max-width: 65em; /*表格最大宽度,避免表格过宽*/
border: 1px solid #dedede; /*表格外边框设置*/
margin: 15px auto; /*外边距*/
border-collapse: collapse; /*使用单一线条的边框*/
empty-cells: show; /*单元格无内容依旧绘制边框*/
tr:
hover {background: #efefef;}
td:
height: 35px; /*统一每一行的默认高度*/
border: 1px solid #dedede; /*内部边框样式*/
padding: 0 10px; /*内边距*/
th:
white-space: nowrap; /*表头内容强制在一行显示*/
font-weight: bold; /*加粗*/
text-align: center !important; /*内容居中,加上 !important 避免被 Markdown 样式覆盖*/
background: rgba(158,188,226,0.2); /*背景色*/
nth-of-type(1){width: 5%; white-space: nowrap;}
nth-of-type(2){width: 15%;}
nth-of-type(3){width: 70%;}
nth-of-type(4){width: 10%;}
tbody
tr:
nth-child(2n){background: rgba(158,188,226,0.12);}
</style>

note 标签

官方

1
2
3
4
5
6
7
8
9
10
使用方式
{% note class_name %} Content (md partial supported) {% endnote %}
其中,class_name 可以是以下列表中的一个值:

default
primary
success
info
warning
danger

第三方

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
<p id="div-border-top-green">
内容
</p>

<p id="div-border-left-red">
内容
[shell tag](/tags/shell)标签
</p>

default
<div class="note default"><p>default</p></div>

primary
<div class="note primary"><p>primary</p></div>

success
<div class="note success"><p>success</p></div>

info
<div class="note info"><p>info</p></div>

warning
<div class="note warning"><p>warning</p></div>

danger
<div class="note danger"><p>danger</p></div>

danger no-icon
<div class="note danger no-icon"><p>danger no-icon</p></div>

可以收缩的内容

  • 可以收缩的内容源码

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    ## 标题1.1
    <details>
    <summary>查看详情</summary>
    ### 标题1.1.1
    * [链接1](https://www.baidu.com)
    ### 标题1.1.2
    * [链接1](https://www.baidu.com)
    ### 标题1.1.3
    * [链接1](https://www.baidu.com)
    </details>


    ## 标题1.2
    <details>
    <summary>查看详情</summary>
    ### 标题1.2.1
    * [链接1](https://www.baidu.com)
    ### 标题1.2.1
    * [链接1](https://www.baidu.com)
    * [链接2](https://www.baidu.com)
    * [链接3](https://www.baidu.com)
    </details>


    ## 标题1.3
    <details>
    <summary>查看详情</summary>
    ### 标题1.3.1
    * [链接1](https://www.baidu.com)
    ### 标题1.3.2
    * [链接1](https://www.baidu.com)
    * [链接2](https://www.baidu.com)
    </details>
  • 可以收缩的内容效果

标题1.1


查看详情

### 标题1.1.1
- 链接1

### 标题1.1.2
- 链接1

### 标题1.1.3
- 链接1

标题1.2


查看详情

### 标题1.2.1
- 链接1

### 标题1.221
- 链接1
- 链接2
- 链接3

标题1.3


查看详情

### 标题1.3.1
- 链接1

### 标题1.3.2
- 链接1
- 链接2

网页表格
















参考文档

冷月无声 wechat
关注也是一种力量
-------------End of article. I appreciate whoever read and leave commends on articles.-------------

本文标题:Markdown格式备注

文章作者:冷月无声

发布时间:2018年09月04日 - 22:09

最后更新:2018年09月14日 - 14:09

原始链接:https://www.lengyuewusheng.com/2018/09/04/00048_Markdown格式备注/

许可协议:本博客所有文章除特别声明外,均采用 BY-NC-SA 3.0许可协议。转载请注明出处!

感谢鼓励!