LoveIt/exampleSite/zh/content/posts/Basic-Markdown-Preview.md
2020-02-16 22:41:38 +08:00

38 KiB
Raw Blame History

author author_link title date lastmod draft description show_in_homepage description_as_summary license tags categories featured_image featured_image_preview comment toc auto_collapse_toc math
Markdown 基本语法预览 2019-08-25T16:22:42+08:00 2019-08-25T16:22:42+08:00 false 这是一篇用于预览 Markdown 基本语法的文章。 true false
Hugo
主题
预览
true true true true

这是一篇用于预览 :(fab fa-markdown): Markdown 基本语法的文章。

文章内容基于 GitHub Flavored Markdown Spec

不包含复杂的规则说明,仅仅展示 GFM 所约定的 Markdown 基本语法。

1 引言

:(fab fa-markdown): Markdown 是一种用于编写结构化文档的纯文本格式。它基于电子邮件和论坛文章的格式所约定。 它由 John Gruber (在 Aaron Swartz 的帮助下)开发,于 2004 年以语法描述和用于将 Markdown 转换为 HTML 的 Perl 脚本 (Markdown.pl) 的形式发布。

在接下来的十年中,许多实现被开发出来。一些用脚注、表和其他文档元素的约定扩展了原始 Markdown 语法。 有些允许 Markdown 文档以 HTML 以外的格式呈现。 像 redditStackOverflow 和 GitHub 这样的网站有上百万的用户在使用 Markdown。 Markdown 开始被应用于网络以外的领域,包括作者书籍、文章、幻灯片、信件和课堂笔记。

2 块和内联元素

我们可以把一个文档看成一系列的块,如段落、引用、列表、标题和代码块。

有些块(如引号和列表)可以包含其它的块,即 容器块 其他的块(如标题和段落)则包含内联元素(如文本、链接、强调、图像、内联代码等),即 叶子块

块的符号总是优先于内联元素的符号。例如:

- `one
- two`
  • `one
  • two`

3 叶子块

本节描述用于组成 Markdown 文档的不同类型的叶子块。

3.1 换行符

***
------
  ____



3.2 标题

{{% admonition "note" "关于 ATX 风格标题和 Setext 风格标题" %}} 本文只展示 ATX 风格标题,关于 Setext 风格标题的介绍请参考 GFM Setext headings 说明

笔者不推荐在 Hugo 的 Markdown 文档中使用 Setext 风格标题。 {{% /admonition %}}

## H2 二级标题
### H3 三级标题
#### H4 四级标题
##### H5 五级标题
###### H6 六级标题

H2 二级标题

H3 三级标题

H4 四级标题

H5 五级标题
H6 六级标题

3.3 代码块

{{% admonition "note" "关于缩进式代码块和围栏式代码块" %}} 本文只展示围栏式代码块,关于缩进式代码块的介绍请参考 GFM Indented code blocks 说明

笔者不推荐在 Hugo 的 Markdown 文档中使用缩进式代码块。 {{% /admonition %}}

```
foo()
```

~~~
foo()
~~~

````
foo()
````

```ruby
def foo(x)
  return 3
end
```
foo()
foo()
foo()
def foo(x)
  return 3
end

{{< highlight go "hl_lines=3 5-7,linenostart=20" >}} package main

import "fmt"

func main() { fmt.Println("Hello, 世界") } {{< / highlight >}}

3.4 段落

这是一个段落。
这还是之前段落的一部分。

这是新的段落。

这是一个段落。 这还是之前段落的一部分。

这是新的段落。

3.5 引用链接的定义

[foo]: / "title"

[foo]

[bar]: /

[bar]

foo

bar

3.6 空白行

块之间的空白行将被忽略,除了它们在确定列表是紧还是松时所起的作用。

文档开头和结尾的空行也会被忽略。

4 容器块

4.1 引用

> Foo
>
> - **bar**
> - baz

Foo

  • bar
  • baz

4.2 无序列表

- 项目 1
    * 项目 A
    - 项目 B
        一些说明
        + 项目 a
        * 项目 b
        - 项目 c
    + 项目 C
+ 项目 2
* 项目 3
  • 项目 1
    • 项目 A
    • 项目 B 一些说明
      • 项目 a
      • 项目 b
      • 项目 c
    • 项目 C
  • 项目 2
  • 项目 3

4.3 有序列表

1. 项目 1
    1. 项目 A
    2. 项目 B
        一些说明
        1. 项目 a
        2. 项目 b
        3. 项目 c
    3. 项目 C
2. 项目 2
3. 项目 3
  1. 项目 1
    1. 项目 A
    2. 项目 B 一些说明
      1. 项目 a
      2. 项目 b
      3. 项目 c
    3. 项目 C
  2. 项目 2
  3. 项目 3

4.4 任务列表

- [ ] 任务 1
    * [X] 任务 A
    - 任务 B
        + [ ] 任务 a
        * [ ] 任务 b
        - [X] 任务 c
    + [X] 任务 C
+ [ ] 任务 2
* [X] 任务 3
  • 任务 1
    • 任务 A
    • 任务 B
      • 任务 a
      • 任务 b
      • 任务 c
    • 任务 C
  • 任务 2
  • 任务 3

4.5 表格

| _颜色_      | 水果          | 蔬菜         |
| ----------  |:---------------:| -----------:|
| 红色           | *苹果*         | 辣椒      |
| ~~橙色~~    | 橘子         | **胡萝卜**        |
| 绿色         | ~~***梨子***~~ | 菠菜           |
颜色 水果 蔬菜
红色 苹果 辣椒
橙色 橘子 胡萝卜
绿色 梨子 菠菜

3. 页内锚

[脚注](#footnote)

## 4. 脚注 {#footnote}

脚注

4. 脚注

这是一个基本的数字脚注[^1]

带有 "label" 标签的脚注[^label]

下定义的脚注[^!DEF]

带有链接的脚注[^pa]

[^1]: 这是一个基本的数字脚注
[^label]: 带有 "label" 标签的脚注
[^pa]: [LoveIt 主题](https://github.com/dillonzq/LoveIt)
[^!DEF]: 下定义的脚注

这是一个基本的数字脚注1

带有 "label" 标签的脚注2

下定义的脚注3

带有链接的脚注4

5. 内联格式

`内联代码块`

<kbd>ctrl</kbd>+<kbd>alt</kbd>+<kbd>del</kbd>

**加粗 1**__加粗 2__

*倾斜 1*_倾斜 2_

~~删除线~~

***加粗 1 和 倾斜 1***

___加粗 2 和 倾斜 2___

__*加粗 2 和 倾斜 1*__

**_加粗 1 和 倾斜 2_**

~~*删除线 倾斜 1*~~*~~删除线 倾斜 2~~*

~~_删除线 倾斜 2_~~_~~删除线 倾斜 2~~_

~~**删除线 加粗 1**~~**~~删除线 加粗 1~~**

~~__删除线 加粗 2__~~__~~删除线 加粗 2~~__

~~***删除线 倾斜 1 加粗 1***~~***~~删除线 倾斜 1 加粗 1~~***

~~___删除线 倾斜 2 加粗 2___~~___~~删除线 倾斜 2 加粗 2~~___

**~~*删除线 倾斜 1 加粗 1*~~** 和 *~~**删除线 倾斜 1 加粗 1**~~*

__~~_删除线 倾斜 2 加粗 2_~~__ 和 _~~__删除线 倾斜 2 加粗 2__~~_

**~~_删除线 倾斜 2 加粗 1_~~** 和 _~~**删除线 倾斜 2 加粗 1**~~_

__~~*删除线 倾斜 1 加粗 2*~~__ 和 *~~__删除线 倾斜 1 加粗 2__~~*

内联代码块

ctrl+alt+del

加粗 1加粗 2

倾斜 1倾斜 2

删除线

加粗 1 和 倾斜 1

加粗 2 和 倾斜 2

加粗 2 和 倾斜 1

加粗 1 和 倾斜 2

删除线 倾斜 1删除线 倾斜 2

删除线 倾斜 2删除线 倾斜 2

删除线 加粗 1删除线 加粗 1

删除线 加粗 2删除线 加粗 2

删除线 倾斜 1 加粗 1删除线 倾斜 1 加粗 1

删除线 倾斜 2 加粗 2删除线 倾斜 2 加粗 2

删除线 倾斜 1 加粗 1删除线 倾斜 1 加粗 1

删除线 倾斜 2 加粗 2删除线 倾斜 2 加粗 2

删除线 倾斜 2 加粗 1删除线 倾斜 2 加粗 1

删除线 倾斜 1 加粗 2删除线 倾斜 1 加粗 2

6. 图片

Web image
![Web Picture](https://static.dillonzq.com/images/20190817130904-U6cPUk.jpg "Web Picture")

Local image
![Local Picture](/images/Apple-Devices-Preview.png)

contact@revolunet.com

@revolunet

Issue #1

https://github.com/revolunet/sublimetext-markdown-preview/

This is a link https://github.com/revolunet/sublimetext-markdown-preview/.

This is a link "https://github.com/revolunet/sublimetext-markdown-preview/".

With this link (https://github.com/revolunet/sublimetext-markdown-preview/), it still works.

Web image Web Picture

Local image Local Picture

https://www.google.com

contact@revolunet.com

@revolunet

Issue #1

https://github.com/revolunet/sublimetext-markdown-preview/

This is a link https://github.com/revolunet/sublimetext-markdown-preview/.

This is a link "https://github.com/revolunet/sublimetext-markdown-preview/".

With this link (https://github.com/revolunet/sublimetext-markdown-preview/), it still works.

Abbreviation

Abbreviations source are found in a separate markdown file specified in frontmatter.

The HTML specification 
is maintained by the W3C.

*[HTML]: Hyper Text Markup Language
*[W3C]:  World Wide Web Consortium

The HTML specification is maintained by the W3C.

Unordered List

Unordered List

- item 1
    * item A
    * item B
        more text
        + item a
        + item b
        + item c
    * item C
- item 2
- item 3

Unordered List

  • item 1
    • item A
    • item B more text
      • item a
      • item b
      • item c
    • item C
  • item 2
  • item 3

Ordered List

Ordered List

1. item 1
    1. item A
    2. item B
        more text
        1. item a
        2. item b
        3. item c
    3. item C
2. item 2
3. item 3

Ordered List

  1. item 1
    1. item A
    2. item B more text
      1. item a
      2. item b
      3. item c
    3. item C
  2. item 2
  3. item 3

Mixed Lists

Really Mixed Lists should break with sane_lists on.

Mixed Lists

- item 1
    * [X] item A
    * [ ] item B
        more text
        1. item a
        2. itemb
        3. item c
    * [X] item C
- item 2
- item 3


Really Mixed Lists

- item 1
    * [X] item A
    - item B
        more text
        1. item a
        + itemb
        + [ ] item c
    3. item C
2. item 2
- [X] item 3

Mixed Lists

  • item 1
    • item A
    • item B more text
      1. item a
      2. itemb
      3. item c
    • item C
  • item 2
  • item 3

Really Mixed Lists

  • item 1
    • item A
    • item B more text
      1. item a
      • itemb
      • item c
    1. item C
  1. item 2
  • item 3

Blocks

    This is a block.

    This is more of a block.

This is a block.

This is more of a block.

Block Quotes

> This is a block quote
>> How does it look?

This is a block quote.

How does it look? I think it looks good.

Fenced Block

Assuming guessing is not enabled.

```
// Fenced **without** highlighting
function doIt() {
    for (var i = 1; i <= slen ; i^^) {
        setTimeout("document.z.textdisplay.value = newMake()", i*300);
        setTimeout("window.status = newMake()", i*300);
    }
}
```

```javascript
// Fenced **with** highlighting
function doIt() {
    for (var i = 1; i <= slen ; i^^) {
        setTimeout("document.z.textdisplay.value = newMake()", i*300);
        setTimeout("window.status = newMake()", i*300);
    }
}
```
// Fenced **without** highlighting
function doIt() {
    for (var i = 1; i <= slen ; i^^) {
        setTimeout("document.z.textdisplay.value = newMake()", i*300);
        setTimeout("window.status = newMake()", i*300);
    }
}
// Fenced **with** highlighting
function doIt() {
    for (var i = 1; i <= slen ; i^^) {
        setTimeout("document.z.textdisplay.value = newMake()", i*300);
        setTimeout("window.status = newMake()", i*300);
    }
}

Tables

| _颜色_      | 水果          | 蔬菜         |
| ------------- |:---------------:| -----------------:|
| red           | *苹果*         | [辣椒](#) |
| ~~橙色~~    | 橘子         | **胡萝卜**        |
| 绿色         | ~~***梨子***~~ | 菠菜           |
颜色 水果 蔬菜
red 苹果 辣椒
橙色 橘子 胡萝卜
绿色 梨子 菠菜
Class or Enum Year Month Day Hours Minutes Seconds* Zone Offset Zone ID toString Output Where Discussed
Instant checked 2013-08-20T15:16:26.355Z Instant Class
LocalDate checked checked checked 2013-08-20 Date Classes
LocalDateTime checked checked checked checked checked checked 2013-08-20T08:16:26.937 Date and Time Classes
ZonedDateTime checked checked checked checked checked checked checked checked 2013-08-21T00:16:26.941+09:00[Asia/Tokyo] Time Zone and Offset Classes
LocalTime checked checked checked 08:16:26.943 Date and Time Classes
MonthDay checked checked --08-20 Date Classes
Year checked 2013 Date Classes
YearMonth checked checked 2013-08 Date Classes
Month checked AUGUST DayOfWeek and Month Enums
OffsetDateTime checked checked checked checked checked checked checked 2013-08-20T08:16:26.954-07:00 Time Zone and Offset Classes
OffsetTime checked checked checked checked 08:16:26.957-07:00 Time Zone and Offset Classes
Duration ** ** ** checked PT20H (20 hours) Period and Duration
Period checked checked checked *** *** P10D (10 days) Period and Duration

Smart Strong

Text with double__underscore__words.

__Strong__ still works.

__this__works__too__

Text with double__underscore__words.

Strong still works.

this__works__too

Smarty

"double quotes"

'single quotes'

da--sh

elipsis...

"double quotes"

'single quotes'

da--sh

elipsis...

Neseted Fences

    ```
    This will still be parsed
    as a normal indented code block.
    ```

```
This will still be parsed
as a fenced code block.
```

- This is a list that contains multiple code blocks.

    - Here is an indented block

            ```
            This will still be parsed
            as a normal indented code block.
            ```

    - Here is a fenced code block:

        ```
        This will still be parsed
        as a fenced code block.
        ```

        > ```
        > Blockquotes?
        > Not a problem!
        > ```
```
This will still be parsed
as a normal indented code block.
```
This will still be parsed
as a fenced code block.
  • This is a list that contains multiple code blocks.

    • Here is an indented block

        ```
        This will still be parsed
        as a normal indented code block.
        ```
      
    • Here is a fenced code block:

      This will still be parsed
      as a fenced code block.
      
      Blockquotes?
      Not a problem!
      

Github Emoji

This is a test for emoji :smile:.  The emojis are images linked to github assets :octocat:.

This is a test for emoji 😄. The emojis are images linked to github assets :octocat:.

People

👍👎👽👼💢😠😧😲👶💙😊💥🙇:bowtie:👦👰‍♀️💔👤👥👏😰💥😖😕👷👮👫💑💏😢😿💘💃👯💨😞😥💫😵💧👂😑👀👊👪😨:feelsgood:🐾:finnadie:🔥😳😦🖕👧:goberserk::godmode:💚😬😁😀💂‍♂️💇💩🙉❤️😍😻💓💗:hurtrealbad:😯👿💁😇👺👹😂😹💋😗😽😚😘😙😆👄💌👨👲👳‍♂️😷💆🤘💪🎵💅:neckbeard:😐🙅😶👃🎶👌🙆‍♀️👴👵👐😮😔😣:person_frowning::person_with_blond_hair::person_with_pouting_face:👇👈👉☝️👆💩😾🙏👸👊💜😡:rage1::rage2::rage3::rage4:🙌🙋☺️😌💞🏃🏃😆😱🙀🙈💩💀😴😪😄😸😃😺😈😏😼😭💖🙊💬🌟😛😝😜😎:suspect:😓💦😅💭👎👍😫👅😤:trollface:💕👬👭😒✌️🚶👋😩😉👩😟💛😋💤

Nature

🐜🐤🐻🐝🪲🐦🌼🐡🐗💐🐛🌵🐫🐱🐈🌸🌰🐔☁️🐮🐄🌙🐊🌀🌳🐶🐕🐬🐉🐲🐪🌾🌍🌎🌏🐘🌲🍂🌓🌛🐟🌁🍀🐸🌕🌝🌐🐐🐹🐥🐣🌿🌺🐝🐴🐨🌗🌜🍃🐆🍁🌌🐒🐵🌔🐭🐁🍄🌑🌚🌃🌊:octocat:🐙🐂🌴🐼🐾🐧🐷🐖🐽🐩🐰🐇🐎🐏🐀🐓🌹🌱🐑🐚🐌🐍❄️:squirrel:🌞🌻☀️🐯🐅🐠🌷🐢🌋🌘🌖🐃🌒🌔🐳🐋🐺

Objects

🎱🍎🎨👟🍼🎈🎍🍌📊🏀🛀🛁🔋🍺🍻🔔🍱🚴👙🎂🃏✒️📘💣📖🔖📑📚👢🎳🍞💼💡🍰📆📲📷🍬📇💿📉📈🍒🍫🎄🎬📋📕🔐🌂♣️🍸💻🎊🍪🌽💳👑🔮🍛🍮🍡🎯📅♦️💵🎎🚪🍩👗📀📧🥚🍆🔌📧✉️📩💶👓📠📁🎆🍥🎣🎏🔦🐬💾🎴🏈👣🍴🍤🍟🎲💎👻🎁💝🍇🍏📗🎸🔫🍔🔨👜🎧♥️🔆👠🔪🍯🏇🍨🍦📥📨📱🎃👖🔑👘🏮📒🍋💄🔒🔏🍭🔊📢🔅🔍🔎🀄📫📪📬📭👞🍖📣🍈📝🎤🔬💽💸💰🎓🚵🎥🎹🎼🔇📛👔📰🔕📓📔🔩🍢📖📂📙📤📦📄📃📟📎🍑🍐📝✏️☎️💊🍍🍕📯📮👝🍗💷👛📌📻🍜🎀🍚🍙🍘🎑💍🏉🎽🍶👡🎅📡🎷🎒✂️📜💺🍧👕👞🚿🎿🚬🏂🔉👾♠️🍝❇️🎇🔈🍲📏🍓🏄🍣🍠🏊💉🎉🎋🍊🍵☎️📞🔭🎾🚽🍅🎩📐🏆🍹🎺👕📺🔓📼📹🎮🎻🍉🎐🍷👚👒🔧💴

Places

🚡✈️🚑🚛🏧🏦💈🔰🚲🚙🌉🚅🚄🚌🚏🚗🎠🏁🎪🌇🌆🇨🇳🚧🏪🎌🇩🇪🏬🇪🇸🏰🏤🏭🎡🚒🇫🇷🇬🇧🚁🏥🏨♨️🏠🏡🇮🇹🏮🗾🏯🇯🇵🇰🇷🚈🏩🚐🚝🗻🚠🚞🗿🏢🚘🚍🚔🚖🎭🚓🏣🚃🌈🚗🚀🎢🚨📍🚣🇷🇺🏫🚢🎰🚤🌠🚉🗽🚂🌅🌄🚟🚕🎫🗼🚜🚥🚋🚆🚊🚩🚎🚚🇬🇧🇺🇸🚦⚠️💒

Symbols

💯🔢🅰️🆎🔤🔡🉑◀️⬇️🔽▶️⤵️⤴️⬅️↙️↘️➡️↪️⬆️↕️🔼↖️↗️🔃🔄🅱️🚼🔙🛄☑️‼️◼️▪️🔲🔠💹🚸🎦🆑🕐🕙🕥🕚🕦🕛🕧🕜🕑🕝🕒🕞🕓🕟🕔🕠🕕🕡🕖🕢🕗🕣🕘🕤㊗️🆒©️💱🛃💠🚯8✴️✳️🔚54🆓#️⃣💟✔️💲✖️🆔🉐⁉️🔟🈁🔵🔷🔶🛅↔️↩️🔗Ⓜ️🚹🚇📴🆕🆖9🚳🚫📵🚷🚭🚱🅾️🆗🔛1🅿️〽️🛂🚰🚮🔘♻️🔴®️🔁🔂🚻🈂️㊙️7:shipit:📶6🔯🔹🔸🔺🔻🔜🆘🔣3™️🔝🔱🔀2🈹🈴🈺🈯🈷️🈶🈵🈚🈸🈲🈳🔞🆙📳🆚〰️🚾💮◻️▫️🔳🚺0

Insert

^^insert^^

^^*insert 倾斜*^^  *^^insert 倾斜 2^^*

^^_insert 倾斜_^^  _^^insert 倾斜 2^^_

^^**insert 加粗**^^  **^^insert 加粗 2^^**

^^__insert 加粗__^^  __^^insert 加粗 2^^__

^^***insert 倾斜 加粗***^^  ***^^insert 倾斜 加粗 2^^***

^^___insert 倾斜 加粗___^^  ___^^insert 倾斜 加粗 2^^___

**^^*insert 倾斜 加粗*^^**  *^^**insert 倾斜 加粗 2**^^*

__^^_insert 倾斜 加粗_^^__  _^^__insert 倾斜 加粗 2__^^_

**^^_insert 倾斜 加粗_^^**  _^^**insert 倾斜 加粗 2**^^_

__^^*insert 倾斜 加粗*^^__  *^^__insert 倾斜 加粗 2__^^*

^^insert^^

^^insert 倾斜^^ ^^insert 倾斜 2^^

^^insert 倾斜^^ ^^insert 倾斜 2^^

^^insert 加粗^^ ^^insert 加粗 2^^

^^insert 加粗^^ ^^insert 加粗 2^^

^^insert 倾斜 加粗^^ ^^insert 倾斜 加粗 2^^

^^insert 倾斜 加粗^^ ^^insert 倾斜 加粗 2^^

^^insert 倾斜 加粗^^ ^^insert 倾斜 加粗 2^^

^^insert 倾斜 加粗^^ ^^insert 倾斜 加粗 2^^

^^insert 倾斜 加粗^^ ^^insert 倾斜 加粗 2^^

^^insert 倾斜 加粗^^ ^^insert 倾斜 加粗 2^^

Admonition

{{% admonition "note" "Admonition note" %}} This is the content of the admonition. {{% /admonition %}}

{{% admonition "abstract" "Admonition abstract" %}} This is the content of the admonition. {{% /admonition %}}

{{% admonition "info" "Admonition info" %}} This is the content of the admonition. {{% /admonition %}}

{{% admonition "tip" "Admonition tip" %}} This is the content of the admonition. {{% /admonition %}}

{{% admonition "success" "Admonition success" %}} This is the content of the admonition. {{% /admonition %}}

{{% admonition "question" "Admonition question" %}} This is the content of the admonition. {{% /admonition %}}

{{% admonition "warning" "Admonition warning" %}} This is the content of the admonition. {{% /admonition %}}

{{% admonition "failure" "Admonition failure" %}} This is the content of the admonition. {{% /admonition %}}

{{% admonition "danger" "Admonition danger" %}} This is the content of the admonition. {{% /admonition %}}

{{% admonition "bug" "Admonition bug" %}} This is the content of the admonition. {{% /admonition %}}

{{% admonition "example" "Admonition example" %}} This is the content of the admonition. {{% /admonition %}}

{{% admonition "quote" "Admonition quote" %}} This is the content of the admonition. {{% /admonition %}}

{{% admonition title="Admonition" details="true" %}} This is the content of the admonition. {{% /admonition %}}


  1. 这是一个基本的数字脚注 ↩︎

  2. 带有 "label" 标签的脚注 ↩︎

  3. 下定义的脚注 ↩︎

  4. LoveIt 主题 ↩︎