MarkDown、Hexo、NexT 常用寫法

發表於 | 更新於 | 分類於 | 評論數：

記不下來就寫下來

MarkDown 常用寫法

字體基本設定

階層式區塊語法
>text 、 >>text 、 >>>text

粗體 **your text**
斜體 *your text*
刪除線 ~~your text~~
超連結 [超連結](https://jimmywei01.github.io/)

  • 小區塊
    `your text`
  • 大區塊
    前後三個反引號

標題

1
2
3
4
5
6
# H1
## H2
### H3
#### H4
##### H5
###### H6

文字增加顏色

20px的字
15px的字 
1
2
<font style="color:#f90;font-size:20px;">20px的字</font>
<font style="color:red;font-size:10px;">10px的字</font>

列表

  • Item 1
  • Item 2
    • Item 2a
    • Item 2b
1
2
3
4
* Item 1
* Item 2
  * Item 2a
  * Item 2b

表格

冒號（Colons）是用來對齊的（擺左齊左、擺右齊右，都擺就置中）

Markdown Less Pretty
Still renders nicely
1 2 3 
1
2
3
4
Markdown | Less | Pretty
--- | :---: | ---:
*Still* | `renders` | nicely
1 | 2 | 3:

Hexo 標籤外掛

hexo 標籤外掛參考連結

https://hexo.io/zh-tw/docs/tag-plugins

hexo 指令

  • 啟動 server
    hexo server

  • 建立新文章
    hexo new post [title]

  • s →啟動伺服器 -g →生成靜態頁面
    hexo s -g

  • d →部屬模式 -g →生成靜態頁面
    hexo d -g

  • 刪除已生成的靜態頁面及快取檔案
    hexo clean

程式碼區塊

寫法

  • [language] 是代碼語言的名稱，用來設置代碼塊顏色高亮，非必須
  • [title] 是頂部左邊的說明，非必須
  • [url] 是頂部右邊的超鏈接地址，非必須
  • [link text] 如它的字面意思，超鏈接的名稱，非必須

使用 代碼塊語法

1
2
3
{% codeblock [language] [title] [url] [link text] %}
  your code
{% endcodeblock %}
css css /index 首頁
1
2
3
4
5
.container {
  max-width: 960px;
  margin: 0 auto;
  margin-top: 10px;
}
  • 加上說明 
1
2
3
{% codeblock Array.map %}
array.map(callback[, thisArg])
{% endcodeblock %}
Array.map
1
array.map(callback[, thisArg])
  • 加上說明和網址
1
2
3
4
{% codeblock _.compact http://underscorejs.org/#compact Underscore.js %}
_.compact([0, 1, false, 2, '', 3]);
=> [1, 2, 3]
{% endcodeblock %}
_.compactUnderscore.js
1
2
_.compact([0, 1, false, 2, '', 3]);
=> [1, 2, 3]

使用 大區塊(前後三個反引號)

1
2
3
``` [language] [title] [url] [link text]
  your code 
```
css首頁 
1
2
3
4
5
6
.container {
  max-width: 960px;
  margin: 0 auto;
  /* 起手式 */
  margin-top: 10px;
}

NexT

無需路徑名插入圖片

  • 新建文章在相同目錄下創建同名文件夾（便於圖片管理）
  • 打開站點配置文件_config.yml/post_asset_folder，設置值為true
  • 安裝hexo-asset-image：npm install hexo-asset-image –save
  • 此時hexo new “fileName”會在/source/_posts目錄下創建同名的文件夾
1
2
只需在md文件裡使用 無需路徑名就可以插入圖片
![title](圖片名.jpg)

文章頁面顯示繼續閱讀

1
<!-- more —>
0%