使用Markdown语法让你的网页更加漂亮,字体,列表,表单,引用,图片等;使用Hugo定义标签支持更多功能:图片,相集,YouTube,代码高亮,音频等

标题标签

[comment]: # Heading 1
[comment]: ## Heading 2
[comment]: ### Heading 3
[comment]: #### Heading 4
[comment]: ##### Heading 5
[comment]: ###### Heading 6

Heading 1

Heading 2

Heading 3

Heading 4

Heading 5
Heading 6

特殊字符

[comment]: [test link]() 
[comment]: **Strong text** 
[comment]: *Italic text* 
[comment]: <u>Underline text</u>
[comment]: ~~Deleted text~~ 
[comment]: `Sed erat diam`

[test link]() Strong text Italic text Underline text Deleted text Sed erat diam

列表类型

标题列表 (dl)


[comment]: <dd>List item1</dd>
[comment]: <dd>List item2</dd>

Title
List item1
List item2

有序列表 (ol)

[comment]: 1. List Item 1
[comment]: 2. List Item 2
[comment]: 3. List Item 3
  1. List Item 1
  2. List Item 2
  3. List Item 3

无序列表 (ul)

[comment]: - List Item 1
[comment]: - List Item 2
[comment]: - List Item 3
  • List Item 1
  • List Item 2
  • List Item 3

表单

[comment]: |  Header 1  | Header 2   | Header 3   |

[comment]: | Division 1 | Division 2 | Division 3 |
[comment]: | Division 1 | Division 2 | Division 3 |
[comment]: | Division 1 | Division 2 | Division 3 |
[comment]: | Division 1 | Division 2 | Division 3 |
Header 1 Header 2 Header 3
Division 1 Division 2 Division 3
Division 1 Division 2 Division 3
Division 1 Division 2 Division 3
Division 1 Division 2 Division 3

特殊字体

[comment]:NormalWords <sup>superscript</sup> NormalWords
[comment]:
[comment]:NormalWords <sub>subscript</sub> NormalWords
[comment]:
[comment]:NormalWords <kdb>ctrl + c</kdb> NormalWords
[comment]:
[comment]:NormalWords <cite>cite</cite> NormalWords
[comment]:
[comment]:NormalWords <acronym title="National Basketball Association">NBA</acronym> NormalWords
[comment]:
[comment]:NormalWords <abbr title="Avenue">AVE</abbr> NormalWords

NormalWords superscript NormalWords

NormalWords subscript NormalWords

NormalWords ctrl + c NormalWords

NormalWords cite NormalWords

NormalWords NBA NormalWords

NormalWords AVE NormalWords

Hugo特殊标签

警告色

参考 Alert tag

Praesent diam elit, interdum ut pulvinar placerat, imperdiet at magna.

Praesent diam elit, interdum ut pulvinar placerat, imperdiet at magna.

Praesent diam elit, interdum ut pulvinar placerat, imperdiet at magna.

Praesent diam elit, interdum ut pulvinar placerat, imperdiet at magna.

引用

参考 Block Quote tag

普通引用

Praesent diam elit, interdum ut pulvinar placerat, imperdiet at magna.

从书本引用

Do not just seek happiness for yourself. Seek happiness for all. Through kindness. Through mercy.

David Levithan Wide Awake

从Twitter引用

NEW: DevDocs now comes with syntax highlighting. //devdocs.io

从网络文章引用

Every interaction is both precious and an opportunity to delight.

代码

参考 Code Block tag

普通代码块

alert('Hello World!');
alert('Hello World!');

带标题的代码块

Array.map
1
2
array.map(callback[, thisArg])

带标题和引用的代码块

apache.confapache.conf
1
2
3
4
5
6
7
8
# rewrite`s rules for wordpress pretty url
LoadModule rewrite_module  modules/mod_rewrite.so
RewriteCond %{REQUEST_FILENAME} !-f

<Location /maps/>
  RewriteMap map txt:map.txt
</Location>

Github的Gist

参考 Gist tag

图片

参考 Image tag

jsFiddle

参考 jsFiddle tag

Pull Quote

参考 Pull Quote tag

Phasellus adipiscing, mauris nec mollis egestas, ipsum nunc auctor velit, et rhoncus lorem ipsum at ante. Duis vel mauris nulla. Maecenas mattis interdum ante, quis sagittis.

Here is a pullquote left. Lorem ipsum dolor sit amet, consectetur adipiscing elit.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas tempus molestie arcu, et fringilla mauris placerat ac. Nullam luctus bibendum risus. Ut cursus sed ipsum feugiat egestas. Suspendisse elementum, Mauris porttitor commodo eros, ac ornare orci interdum in. Cras fermentum cursus leo sed mattis. In dignissim lorem sem, sit amet elementum mauris venenatis ac.

Here is a pullquote right. Lorem ipsum dolor sit amet, consectetur adipiscing elit.

Donec non tempus arcu. Phasellus adipiscing, mauris nec mollis egestas, ipsum nunc auctor velit, et rhoncus lorem ipsum at ante. Duis vel mauris nulla. dignissim ultrices libero. Sed imperdiet urna et quam ultrices tincidunt nec ac magna. Etiam vel pharetra elit.

文本高亮

参考 Highlight text tag

highlight redhighlight green highlight blue highlight purplehighlight orangehighlight yellow highlight cyan highlight primary highlight success highlight warninghighlight danger

多选项卡代码(多语言代码)

参考 Tabbed code block

tabbed_codeblock

Youtube/Vimeo视频

参考 Youtube tag 参考 Vimeo tag

Youtube and Vimeo videos are easily integrated thanks to tags plugins. Of course, you can add video other platforms like dailymotion.

Youtube

Vimeo

超宽图片

参考 Wide image tag

Mercedes SLSMercedes SLS