Markdown 11 种基本语法 [转]

学完这些Markdown的基本使用已经不成问题

Hexo在Github中搭建博客系统(5)Markdown语法


前面我们已经知道怎么搭博客系统、发布、创建文章,现在到了创建内容的时候,需要熟练掌握Markdown的语法

基本语法

(0) 特殊字符

之所以把特殊字符放到最前面,就是因为Markdown对特殊字符处理不是很友好,很容易出现很奇怪的异常,其实就是因为文章中包含了特殊字符无法编译通过导致Hexo无法渲染
在写博客时,一定注意不要写这些字符,如果要写,就进行转义
有些人可能说可以使用反斜杠 \ 来处理,我这里不建议,因为我使用的时候没有解决问题。
下面是比较常见的几个:

! ! — 惊叹号Exclamation mark
” " " 双引号Quotation mark
# # — 数字标志Number sign
$ $ — 美元标志Dollar sign
% % — 百分号Percent sign
& & & Ampersand
‘ ' — 单引号Apostrophe
( ( — 小括号左边部分Left parenthesis
) ) — 小括号右边部分Right parenthesis
* * — 星号Asterisk
+ + — 加号Plus sign
< < < 小于号Less than
= = — 等于符号Equals sign
> > > 大于号Greater than
? ? — 问号Question mark
@ @ — Commercial at
[ [ --- 中括号左边部分Left square bracket
\ \ --- 反斜杠Reverse solidus (backslash)
] ] — 中括号右边部分Right square bracket
{ { — 大括号左边部分Left curly brace
| | — 竖线Vertical bar
} } — 大括号右边部分Right curly brace
特别注意的是小括号 ( ) 大括号 { } ,如果不小心写了,你执行hexo s –debug可能报一些莫名其妙的错误!
这里还有更多关于特殊字符如何转义的内容

(1) 标题

在文字前加上#号

# 一级标题
## 二级标题
### 三级标题
#### 四级标题
##### 五级标题
###### 六级标题

大标题
=
小标题
-
预览效果:

一级标题

二级标题

三级标题

四级标题

五级标题

六级标题

大标题

小标题

(2) 粗体斜体

*斜体文本*    _斜体文本_
**粗体文本**    __粗体文本__
***粗斜体文本***    ___粗斜体文本___
预览效果:
斜体文本 斜体文本
粗体文本 粗体文本
粗斜体文本 粗斜体文本

(3) 链接

常用链接方法
文字链接 [链接名称](https://chwshuang.github.io)
网址链接 


高级链接技巧
这个链接用 1 作为网址变量 [Google][1].
这个链接用 yahoo 作为网址变量 [Yahoo!][yahoo].
然后在文档的结尾为变量赋值(网址)

  [1]: http://www.google.com/
  [yahoo]: http://www.yahoo.com/
预览效果:
文字链接 链接名称
网址链接 http://hushuang.me

高级链接技巧
这个链接用 1 作为网址变量 Google.
这个链接用 yahoo 作为网址变量 Yahoo!.

(4) 列表

普通无序列表

- 列表文本前使用 [减号+空格]
+ 列表文本前使用 [加号+空格]
* 列表文本前使用 [星号+空格]
普通有序列表

1. 列表前使用 [数字+空格]
2. 我们会自动帮你添加数字
7. 不用担心数字不对,显示的时候我们会自动把这行的 7 纠正为 3
列表嵌套

1. 列出所有元素:
    - 无序列表元素 A
        1. 元素 A 的有序子列表
    - 前面加四个空格
2. 列表里的多段换行:
    前面必须加四个空格,
    这样换行,整体的格式不会乱
3. 列表里引用:

    > 前面空一行
    > 仍然需要在 >  前面加四个空格
(5) 引用

普通引用

> 引用文本前使用 [大于号+空格]
> 折行可以不加,新起一行都要加上哦
引用里嵌套引用

> 最外层引用
> > 多一个 > 嵌套一层引用
> > > 可以嵌套很多层
引用里嵌套列表

> - 这是引用里嵌套的一个列表
> - 还可以有子列表
>     * 子列表需要从 - 之后延后四个空格开始
(6) 图片

跟链接的方法区别在于前面加了个感叹号!,这样是不是觉得好记多了呢?

![图片名称](http: //图片地址)
当然,你也可以像网址那样对图片网址使用变量

这个链接用 1 作为网址变量 [ Google] [ 1].
然后在文档的结尾位变量赋值(网址)

[1]: http: //www.google.com/logo.png
也可以使用 HTML 的图片语法来自定义图片的宽高大小




(7) 换行

如果另起一行,只需在当前行结尾加 2 个空格

在当前行的结尾加 2 个空格
这行就会新起一行
如果是要起一个新段落,只需要空出一行即可。
(8) 分隔符

如果你有写分割线的习惯,可以新起一行输入三个减号-。当前后都有段落时,请空出一行:

前面的段落

---

后面的段落
(9) 小型文本

Markdown语法:

文本内容
预览效果:
我是正常文字
我是小型文字

(10) 注释

用html的注释,好像只有这样?


(11) 表格

Markdown的扩展语法,hexo已经支持

| 参数           | 说明                 |   默认值            |
| ------------- |:-------------------:|:------------------:|
| host          | 远程主机的地址         |                    |
| user          | 使用者名称            |                    |
| root          |  远程主机的根目录      |                    |
| port          | 端口                 |       22           |
| delete        | 删除远程主机上的旧文件   |  true              |
| verbose       | 显示调试信息           |   true             |
| ignore_errors | 忽略错误              |     false          |

参数  说明  默认值
host    远程主机的地址
user    使用者名称
root    远程主机的根目录
port    端口  22
delete  删除远程主机上的旧文件 true
verbose 显示调试信息  true
ignore_errors   忽略错误    false
最后:
还是要注意特殊字符的处理,其他的就是排版样式的问题,特殊字符没处理好,就是Hexo渲染报错

参考资料:
Markdown 编辑器语法指南
Markdown入门学习小结


Markdown 11种基本语法

1. 标题设置(让字体变大,和word的标题意思一样)
在Markdown当中设置标题,有两种方式:
第一种:通过在文字下方添加“=”和“-”,他们分别表示一级标题和二级标题。
第二种:在文字开头加上 “#”,通过“#”数量表示几级标题。(一共只有1~6级标题,1级标题字体最大)

2. 块注释(blockquote)
通过在文字开头添加“>”表示块注释。(当>和文字之间添加五个blank时,块注释的文字会有变化。)

3. 斜体
将需要设置为斜体的文字两端使用1个“*”或者“_”夹起来

4. 粗体
将需要设置为斜体的文字两端使用2个“*”或者“_”夹起来

5. 无序列表
在文字开头添加(*, +, and -)实现无序列表。但是要注意在(*, +, and -)和文字之间需要添加空格。(建议:一个文档中只是用一种无序列表的表示方式)

6. 有序列表
使用数字后面跟上句号。(还要有空格)

7. 链接(Links)
Markdown中有两种方式,实现链接,分别为内联方式和引用方式。
内联方式:This is an [example link](http://example.com/).
引用方式:
I get 10 times more traffic from [Google][1] than from [Yahoo][2] or [MSN][3].

[1]: http://google.com/        "Google"
[2]: http://search.yahoo.com/  "Yahoo Search"
[3]: http://search.msn.com/    "MSN Search"


8. 图片(Images)
图片的处理方式和链接的处理方式,非常的类似。
内联方式:![alt text](/path/to/img.jpg "Title")
引用方式:
![alt text][id]

[id]: /path/to/img.jpg "Title"

9. 代码(HTML中所谓的Code)
实现方式有两种:
第一种:简单文字出现一个代码框。使用`
`。(`不是单引号而是左上角的ESC下面~中的`) 第二种:大片文字需要实现代码框。使用Tab和四个空格。 10. 脚注(footnote) 实现方式如下: hello[^hello] [^hello]: hi 11. 下划线 在空白行下方添加三条“-”横线。(前面讲过在文字下方添加“-”,实现的2级标题) References: 以上内容根据官方文档基本文档进行整理。http://daringfireball.net/projects/markdown/basics Markdown官方网站:http://daringfireball.net/projects/markdown/ 推荐一款在线的Markdown编辑器:https://stackedit.io/

(http://www.cnblogs.com/hnrainll/p/3514637.html)

MacDown markdown 语法的样子

MacDown logo

Hello there! I’m MacDown, the open source Markdown editor for OS X.

Let me introduce myself.

Markdown and I

Markdown is a plain text formatting syntax created by John Gruber, aiming to provide a easy-to-read and feasible markup. The original Markdown syntax specification can be found here.

MacDown is created as a simple-to-use editor for Markdown documents. I render your Markdown contents real-time into HTML, and display them in a preview panel.

MacDown Screenshot

I support all the original Markdown syntaxes. But I can do so much more! Various popular but non-standard syntaxes can be turned on/off from the Markdown preference pane.

You can specify extra HTML rendering options through the Rendering preference pane.

You can customize the editor window to you liking in the Editor preferences pane:

You can configure various application (that’s me!) behaviors in the General preference pane.

The Basics

Before I tell you about all the extra syntaxes and capabilities I have, I’ll introduce you to the basics of standard markdown. If you already know markdown, and want to jump straight to learning about the fancier things I can do, I suggest you skip to the Markdown preference pane. Lets jump right in.

Line Breaks

To force a line break, put two spaces and a newline (return) at the end of the line.

  • This two-line bullet
    won’t break

  • This two-line bullet
    will break

Here is the code:

1
2
3
4
5
* This two-line bullet 
won't break

* This two-line bullet
will break

Strong and Emphasize

Strong: **Strong** or __Strong__ (Command-B)
Emphasize: *Emphasize* or _Emphasize_[^emphasize] (Command-I)

Headers (like this one!)

Header 1
========

Header 2
--------

or

# Header 1
## Header 2
### Header 3
#### Header 4
##### Header 5
###### Header 6

Inline

Just put angle brackets around an email and it becomes clickable: uranusjr@gmail.com
<uranusjr@gmail.com>

Same thing with urls: http://macdown.uranusjr.com
<http://macdown.uranusjr.com>

Perhaps you want to some link text like this: Macdown Website
[Macdown Website](http://macdown.uranusjr.com "Title") (The title is optional)

Reference style

Sometimes it looks too messy to include big long urls inline, or you want to keep all your urls together.

Make a link [a link][arbitrary_id] then on it’s own line anywhere else in the file:
[arbitrary_id]: http://macdown.uranusjr.com "Title"

If the link text itself would make a good id, you can link like this [like this][], then on it’s own line anywhere else in the file:
[like this]: http://macdown.uranusjr.com

Images

Inline

![Alt Image Text](path/or/url/to.jpg "Optional Title")

Reference style

![Alt Image Text][image-id]
on it’s own line elsewhere:
[image-id]: path/or/url/to.jpg "Optional Title"

Lists

  • Lists must be preceded by a blank line (or block element)
  • Unordered lists start each item with a *
  • - works too
    • Indent a level to make a nested list
      1. Ordered lists are supported.
      2. Start each item (number-period-space) like 1.
      3. It doesn’t matter what number you use, I will render them sequentially
      4. So you might want to start each line with 1. and let me sort it out

Here is the code:

1
2
3
4
5
6
7
8
* Lists must be preceded by a blank line (or block element)
* Unordered lists start each item with a `*`
- `-` works too
* Indent a level to make a nested list
1. Ordered lists are supported.
2. Start each item (number-period-space) like `1. `
42. It doesn't matter what number you use, I will render them sequentially
1. So you might want to start each line with `1.` and let me sort it out

Block Quote

Angle brackets > are used for block quotes.
Technically not every line needs to start with a > as long as
there are no empty lines between paragraphs.
Looks kinda ugly though.

Block quotes can be nested.

Multiple Levels

Most markdown syntaxes work inside block quotes.

Here is the code:

1
2
3
4
5
6
7
8
9
10
11
12
> Angle brackets `>` are used for block quotes.  
Technically not every line needs to start with a `>` as long as
there are no empty lines between paragraphs.
> Looks kinda ugly though.
> > Block quotes can be nested.
> > > Multiple Levels
>
> Most markdown syntaxes work inside block quotes.
>
> * Lists
> * [Links][arbitrary_id]
> * Etc.

Inline Code

Inline code is indicated by surrounding it with backticks:
`Inline code`

If your code has `backticks` that need to be displayed, you can use double backticks:

``Code with `backticks` `` ```` (mind the spaces preceding the final set of backticks)
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
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51


### Block Code
If you indent at least four spaces or one tab, I'll display a code block.

print('This is a code block')
print('The block must be preceded by a blank line')
print('Then indent at least 4 spaces or 1 tab')
print('Nesting does nothing. Your code is displayed Literally')

I also know how to do something called [Fenced Code Blocks](#fenced-code-block) which I will tell you about later.

### Horizontal Rules
If you type three asterisks `***` or three dashes `---` on a line, I'll display a horizontal rule:

***


## <a name="markdown-pane"></a>The Markdown Preference Pane
This is where I keep all preferences related to how I parse markdown into html.
![Markdown preferences pane](http://d.pr/i/RQEi+)

### Document Formatting
The ***Smartypants*** extension automatically transforms straight quotes (`"` and `'`) in your text into typographer’s quotes (`“`, `”`, `‘`, and `’`) according to the context. Very useful if you’re a typography freak like I am. Quote and Smartypants are syntactically incompatible. If both are enabled, Quote takes precedence.


### Block Formatting

#### Table

This is a table:

First Header | Second Header
------------- | -------------
Content Cell | Content Cell
Content Cell | Content Cell

You can align cell contents with syntax like this:

| Left Aligned | Center Aligned | Right Aligned |
|:------------- |:---------------:| -------------:|
| col 3 is | some wordy text | $1600 |
| col 2 is | centered | $12 |
| zebra stripes | are neat | $1 |

The left- and right-most pipes (`|`) are only aesthetic, and can be omitted. The spaces don’t matter, either. Alignment depends solely on `:` marks.

#### <a name="fenced-code-block">Fenced Code Block</a>

This is a fenced code block:

print(‘Hello world!’)

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
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72

You can also use waves (`~`) instead of back ticks (`` ` ``):

~~~
print('Hello world!')
~~~


You can add an optional language ID at the end of the first line. The language ID will only be used to highlight the code inside if you tick the ***Enable highlighting in code blocks*** option. This is what happens if you enable it:

![Syntax highlighting example](http://d.pr/i/9HM6+)

I support many popular languages as well as some generic syntax descriptions that can be used if your language of choice is not supported. See [relevant sections on the official site](http://macdown.uranusjr.com/features/) for a full list of supported syntaxes.


### Inline Formatting

The following is a list of optional inline markups supported:

Option name | Markup | Result if enabled |
--------------------|------------------|-----------------------|
Intra-word emphasis | So A\*maz\*ing | So A<em>maz</em>ing |
Strikethrough | \~~Much wow\~~ | <del>Much wow</del> |
Underline [^under] | \_So doge\_ | <u>So doge</u> |
Quote [^quote] | \"Such editor\" | <q>Such editor</q> |
Highlight | \==So good\== | <mark>So good</mark> |
Superscript | hoge\^(fuga) | hoge<sup>fuga</sup> |
Autolink | http://t.co | <http://t.co> |
Footnotes | [\^4] and [\^4]: | [^4] and footnote 4 |

[^4]: You don't have to use a number. Arbitrary things like `[^footy note4]` and `[^footy note4]:` will also work. But they will *render* as numbered footnotes. Also, no need to keep your footnotes in order, I will sort out the order for you so they appear in the same order they were referenced in the text body. You can even keep some footnotes near where you referenced them, and collect others at the bottom of the file in the traditional place for footnotes.




## <a name="rendering-pane"></a>The Rendering Preference Pane
This is where I keep preferences relating to how I render and style the parsed markdown in the preview window.
![Rendering preferences pane](http://d.pr/i/rT4d+)

### CSS
You can choose different css files for me to use to render your html. You can even customize or add your own custom css files.

### Syntax Highlighting
You have already seen how I can syntax highlight your fenced code blocks. See the [Fenced Code Block](#fenced-code-block) section if you haven’t! You can also choose different themes for syntax highlighting.

### TeX-like Math Syntax
I can also render TeX-like math syntaxes, if you allow me to.[^math] I can do inline math like this: \\( 1 + 1 \\) or this (in MathML): <math><mn>1</mn><mo>+</mo><mn>1</mn></math>, and block math:

\\[
A^T_S = B
\\]

or (in MathML)

<math display="block">
<msubsup><mi>A</mi> <mi>S</mi> <mi>T</mi></msubsup>
<mo>=</mo>
<mi>B</mi>
</math>



### Task List Syntax
1. [x] I can render checkbox list syntax
* [x] I support nesting
* [x] I support ordered *and* unordered lists
2. [ ] I don't support clicking checkboxes directly in the html window


### Jekyll front-matter
If you like, I can display Jekyll front-matter in a nice table. Just make sure you put the front-matter at the very beginning of the file, and fence it with `---`. For example:


title: “Macdown is my friend”
date: 2014-06-06 20:00:00



### Render newline literally
Normally I require you to put two spaces and a newline (aka return) at the end of a line in order to create a line break. If you like, I can render a newline any time you end a line with a newline. However, if you enable this, markdown that looks lovely when I render it might look pretty funky when you let some *other* program render it.





## <a name="general-pane"></a>The General Preferences Pane

This is where I keep preferences related to application behavior.  
![General preferences pane](http://d.pr/i/rvwu+)

The General Preferences Pane allows you to tell me how you want me to behave. For example, do you want me to make sure there is a document open when I launch? You can also tell me if I should constantly update the preview window as you type, or wait for you to hit `command-R` instead. Maybe you prefer your editor window on the right? Or to see the word-count as you type. This is also the place to tell me if you are interested in pre-releases of me, or just want to stick to better-tested official releases.  

## <a name="editor-pane"></a>The Editor Preference Pane
This is where I keep preferences related to the behavior and styling of the editing window.  
![Editor preferences pane](http://d.pr/i/6OL5+)


### Styling

My editor provides syntax highlighting. You can edit the base font and the coloring/sizing theme. I provided some default themes (courtesy of [Mou](http://mouapp.com)’s creator, Chen Luo) if you don’t know where to start.

You can also edit, or even add new themes if you want to! Just click the ***Reveal*** button, and start moving things around. Remember to use the correct file extension (`.styles`), though. I’m picky about that.

I offer auto-completion and other functions to ease your editing experience. If you don’t like it, however, you can turn them off.





## Hack On

That’s about it. Thanks for listening. I’ll be quiet from now on (unless there’s an update about the app—I’ll remind you for that!).

Happy writing!


[^emphasize]: If **Underlines** is turned on, `_this notation_` will render as underlined instead of emphasized 

[^under]: If **Underline** is disabled `_this_` will be rendered as *emphasized* instead of being underlined.

[^quote]: **Quote** replaces literal `"` characters with html `<q>` tags. **Quote** and **Smartypants** are syntactically incompatible. If both are enabled, **Quote** takes precedence. Note that **Quote** is different from *blockquote*, which is part of standard Markdown.

[^math]: Internet connection required.