MarkDown常用寫法(置頂)

發表於 | 分類於 | 0 comments

將常用的 MarkDown 紀錄在這，

Ctrl + C 、 Ctrl + V

比較方便。

文字加顏色

藍色字 
1
<font color="blue">藍色字</font>
紅色的字 
1
<font color="red">紅色的字</font>
20px 的字 
1
<font style="color:#f90;font-size:20px;">20px的字</font>

MARKDOWN/HTML 常用語法小結

文字增加背景色塊

站点配置文件

主题配置文件

站点配置文件

主题配置文件

1
2
3
4
<span id="inline-blue">站点配置文件</span>
<span id="inline-purple">主题配置文件</span>
<span id="inline-yellow">站点配置文件</span>
<span id="inline-green">主题配置文件</span>

自定義樣式

下列 自定義樣式，參考 超深度优化

文本置中引用

我不是一個偉大的程式設計師,我只是一個具有良好習慣的優秀程式設計師。

1
2
3
{% cq %}
我不是一個偉大的程式設計師,我只是一個具有良好習慣的優秀程式設計師。
{% endcq %}

数字塊

1.左邊是效果。
2.我是第二行。

客制 CSS 文件位置：~/blog/themes/next/source/css/\_custom/custom.styl
1
2
3
4
<span id="inline-toc">1.</span>
<span id="inline-toc">2.</span>

`

label標籤

default 
1
2
{% label default@default %}
`
primary 
1
{% label primary@primary %}
success 
1
{% label success@success %}
info 
1
{% label info@info %}
warning 
1
{% label warning@warning %}
danger 
1
{% label danger@danger %}

note 標籤

default no-icon
1
<div class="note default no-icon">default no-icon</div>
default
1
<div class="note default">default</div>
primary
1
<div class="note primary">primary</div>
success
1
<div class="note success">success</div>
info
1
<div class="note info">info</div>
warning
1
<div class="note warning">warning</div>
danger
1
<div class="note danger">danger</div>

引用

内容
客制 CSS 文件位置：~/blog/themes/next/source/css/\_custom/custom.styl
1
2

<blockquote class="question">内容</blockquote>

程式碼

行內

height: 50px;

1
`height: 50px;`

區段

區段寫法
1
2
3
4
5
6
```[language] [title] [url] [link-text]
- [language] 是代碼語言的名稱，用來設置代碼塊顏色高亮，非必須；
- [title] 是頂部左邊的說明，非必須；
- [url] 是頂部右邊的超鏈接地址，非必須；
- [link text] 如它的字面意思，超鏈接的名稱，非必須。
```

上述 4 項應該是根據 空格 來分隔，而不是 []，故請不要加 []。
除非如果你想寫後面兩個，但不想寫前面兩個，那麼就必須加 [] 了，
要這樣寫： [] [] [url] [link text]。

MarkDown 寫法：

CSS
1
2
3
4
5
6
7
8
``` CSS
.container {
    max-width: 960px;
    margin: 0 auto;
    /* 起手式 */
    margin-top: 10px;`
}
```
js
1
2
3
4
5
6
7
8
9
10
11
12
13
``` js
.container {
    function checkList(e) {
        var num = e.target.dataset.num;
        // console.log(e.target.nodeName);
        if (e.target.nodeName !== 'LI') {
            return
        };
        country.splice(num, 1);
        updateList();
    }
}
```
可支援的語法： 連結

插入圖片

內部圖片

1
{% asset_img logo.png logo %}

外部圖片

Mario

1
![Mario](https://goo.gl/2Dty9K)

文字超連結

More info: Writing

Google 連結：Google

1
2
3
More info: [Writing](https://hexo.io/docs/writing.html)

Google 連結：[Google](https://www.google.com.tw/)

項目標籤

符號

  • 序列 1
  • 序列 2
  • 序列 3
1
2
3
- 序列 1
- 序列 2
- 序列 3

Check

  • 序列 1
  • 序列 2
  • 序列 3
  • 序列 4
1
2
3
4
- [ ] 序列 1
- [ ] 序列 2
- [ ] 序列 3
- [ ] 序列 4

數字

  1. 序列 1
  2. 序列 2
  3. 序列 3
  4. 序列 4
1
2
3
4
1.  序列 1
2.  序列 2
3.  序列 3
4.  序列 4

重點標示

Strong emphasis, aka bold, with asterisks or underscores.

Combined emphasis with asterisks and underscores.

Strikethrough uses two tildes. Scratch this.

1
2
3
4
5
Strong emphasis, aka bold, with **asterisks** or **underscores**.

Combined emphasis with **asterisks and _underscores_**.

Strikethrough uses two tildes. ~~Scratch this.~~