【hexo博客進階】1.Markdown語法


前言

如果你想讓你的博客,看起來更加美觀,學習markdown是必要的,你不需要存在害怕的心理,因為markdown十分簡單,就是記住幾個符號就行了,不是你想象的他和學習編程語言一樣復雜。

在開始之前,我們需要一個markdown的編輯器,來幫助我們識別markdown的文本,我推薦你使用Typora

https://www.typora.io/

image

教程順序參考https://www.runoob.com/markdown/


標題

語法展示:

# 一級標題
## 二級標題
### 三級標題
#### 四級標題
##### 五級標題
###### 六級標題

我們常常需要用到標題,在markdown中標題使用#號表示,一個#代表1級標題,一共有6個級別,他們的大小依次變小

image


段落

在markdown里面段落沒有語法,但是你還是需要注意怎么划分段落

如果你一直編輯一段文字,沒有空格兩個以上並且按下回車鍵(換行),這一段文字就自成一段

在Typora里面只需要回車換行

image


字體

在markdown里面也有斜體粗體,語法如下:

*斜體文本*
_斜體文本_
**粗體文本**
__粗體文本__
***粗斜體文本***
___粗斜體文本___

我不太建議你用下划線,因為下划線會連在一起,不好區分數量,建議使用下面的語法形式:

*斜體文本*
**粗體文本**
***粗斜體文本***

分隔線

在你編輯很多文字之后,如果不使用分隔線,可能會讓讀者錯亂,使用分隔線會有一種層次感。

分隔線在一行中,使用三個以上的星號、減號、下划線來建立(可以隔開)

語法:

***

----------

_ _ _

image


刪除線

刪除線就是給文本加上刪除線,在文本兩端使用兩個波浪線~

~~文本~~

下划線

在markdown里面並沒有關於下划線的語法,但是markdown允許你插入一些基本的HTML代碼,下划線語法如下:

<u>這是一個有下划線的文本</u>

列表

列表分為有序和無序

無序列表

無序列表使用星號*、加號 +、減號 -

語法如下:

* 第一項
* 第二項
* 第三項

+ 第一項
+ 第二項
+ 第三項


- 第一項
- 第二項
- 第三項

注意需要和符號之間保持一個空格

image


有序列表

有序列表其實很簡單,就是數字加上.

文本使用空格隔開

1. 第一項
2. 第二項
3. 第三項

列表嵌套

有序和無序可以一起使用,只需要在子列表的選項添加四個空格

語法:

1. 第一項:
    - 子列表1
    - 子列表2
2. 第二項:
    - 子列表1
    - 子列表2

區塊

區塊是用來引用的,比如鏈接或者一段文本

在段落的開頭使用>符號,使用空格,隔開文本

> 引用的內容
>
> 第二段引用的內容

在引用里面也是分段落的,我們不是使用回車,而是使用>成單個一行

區塊嵌套

> 引用
>> 2
>>
>>>3

image


代碼塊

這是一個程序員專用的語法,代碼塊可以展示不同語言的代碼,並且有不同的高亮顯示,代碼塊語法如下:

上下使用三個點進行包裹,最頂上的可以寫上代碼的類型

​```javascript
$(document).ready(function () {
    alert('RUNOOB');
});
​```

image


鏈接

插入鏈接有兩種方式:

  • 第一種:直接插入

https://mrhuanhao.cn/

這種方式適用於短的鏈接,但是過長的鏈接可能會看起來不得當

  • 第二種:使用markdown語法插入

其實就是讓一段文本,擁有跳轉功能

語法如下:

[鏈接名稱](鏈接地址)

或者

<鏈接地址>

例如:

[huanhao的主頁](https://mrhuanhao.cn/)
<https://mrhuanhao.cn/>

圖片

在一個文章里面插入圖片是必不可少的,本地的文章可以使用本地圖片,在你上傳博客之后,也必須上傳本地圖片,但這樣會有弊端。

使用本地圖片會嚴重拖慢博客速度,我們需要使用超鏈接進行插入圖片,也就是把圖片上傳的某個服務器上面,然后獲取圖片在服務器上面的地址。

但是我們也可以使用免費的托管或者圖床,上傳我們的圖片,本篇教程不教圖床的使用,下篇文章將會提到。

插入圖片的語法:

![圖片描述](圖片的鏈接)

表格

在markdown里面是可以插入表格的,可以體現一些數據

語法:

|  表頭   | 表頭  |
|  ----  | ----  |
| 單元格  | 單元格 |
| 單元格  | 單元格 |

讓表格自動對其方式

  • 居右-:

  • 居左:-

  • 居中:-:

語法如下:

| 左對齊 | 右對齊 | 居中對齊 |
| :-----| ----: | :----: |
| 單元格 | 單元格 | 單元格 |
| 單元格 | 單元格 | 單元格 |

我們只需要在第二行插入分隔線


轉義字符

因為在markdown的語法里面,用了一些特定的符號作為語法,如果我們想輸出符號,而不是被識別成語法,就需要使轉義字符

只需要使用反斜杠,然后加上下面的某個符號即可

\   反斜線
`   反引號
*   星號
_   下划線
{}  花括號
[]  方括號
()  小括號
#   井字號
+   加號
-   減號
.   英文句點
!   感嘆號
  • 不使用轉義字符:

image

  • 使用了轉義字符

image


其他高級語法

在大多的markdown編輯器中,可能無法展示高級語法,以上的語法完全夠用,你也可以無需學習高級語法。

高級語法有如下內容(只展示部分):

  • 數學公式
$$
\mathbf{V}_1 \times \mathbf{V}_2 =  \begin{vmatrix} 
\mathbf{i} & \mathbf{j} & \mathbf{k} \\
\frac{\partial X}{\partial u} &  \frac{\partial Y}{\partial u} & 0 \\
\frac{\partial X}{\partial v} &  \frac{\partial Y}{\partial v} & 0 \\
\end{vmatrix}
${$tep1}{\style{visibility:hidden}{(x+1)(x+1)}}
$$
  • HTML元素
<kbd>Ctrl</kbd>+<kbd>Alt</kbd>+<kbd>Del</kbd>
  • 流程圖
``flow
st=>start: 開始框
op=>operation: 處理框
cond=>condition: 判斷框(是或否?)
sub1=>subroutine: 子流程
io=>inputoutput: 輸入輸出框
e=>end: 結束框
st->op->cond
cond(yes)->io->e
cond(no)->sub1(right)->op
​```

我的同步更新博客地址https://mrhuanhao.cn/


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM