Markdown 從零開始 基本文法篇
要寫好一篇漂亮的Blog文章,就從認識Markdown開始,本篇使用Visual studio code 開發 (關於VSCode開發Markdown文件請參考Markdown 從零開始 開發工具篇),在開始之前先讓我們一起認識Markdown的基本文法有哪些吧!
套件安裝
本篇使用的是 Markdown All in One 套件。
文法介紹
Setp1. 標題表示法
支援六個層級的標題表示法,透過 #
符號,符號越多代表層級越低,結構以HTML的 <h1> ~ <h6>
表示。
標題一
標題二
標題三
標題四
標題五
標題六
# 標題一
## 標題二
### 標題三
#### 標題四
##### 標題五
###### 標題六
Setp2. 項目清單表示法
項目清單表示法有三種:【*】【-】【+】, 可透過Markdown All in One提供的 Toggle list快速產生項目清單清單功能
產生項目符號清單
產生項目編號清單
Setp3. 檢查清單
快速實現檢查清單功能,透過Visual Studio Code 快速選取首字快速鍵 Ctrl + Alt + 上下鍵
直接於首字前面輸入 -[ ]
符號,即可快速產生檢查清單功能,並且可透過快速鍵 Alt + C
實現快速勾選檢查清單功能 。
- 汽車
- 機車
- 電動車
- 腳踏車
方法
-[ ] 汽車
-[x] 機車
-[ ] 電動車
-[ ] 腳踏車
Setp4. 字型
粗體 斜體
刪除線
**粗體**
_斜體_
~~刪除線~~
Setp5. 分隔線
可透過以下符號:星號、減號、底線來建立一個分隔線
***
* * *
---
- - -
Setp6. 引言
若要特別引用或是標籤式概念,可在字首透過 >
符號產生區塊引言,支援多個層級的寫法
測試測試測試測試
測試測試測試測試
測試測試測試測試
測試測試測試測試
測試測試測試測試
> 測試測試測試測試
>> 測試測試測試測試
>>> 測試測試測試測試
>>>> 測試測試測試測試
>>>>> 測試測試測試測試
Setp7. 行內程式碼
在一個段落的句子中間,可以將程式碼內容前後加上反引號【`】,我們就可以在一個段落中穿插程式碼語言囉。
前後包夾文字
var a = 1
前後包夾文字
前後包夾文字`var a = 1`前後包夾文字
Setp8. 程式碼區塊
使用三個連續的反引號【`】作為開頭與結尾,即可展示區塊程式碼,並且於首行加上特定程式碼語言名稱,該區塊就可使用特定語言的 Highlight,可參考 Highlight Supported Languages
c#
public class MyClass{}
public void Run{}
```cs
public class MyClass{}
public void Run{}
```
Json
{"name":"Vivi", "age":32, "phone":null}
```json
{"name":"Vivi", "age":32, "phone":null}
```
HTML
<script type="text/javascript">
alert("Hello");
</script>
```html
<script type="text/javascript">
alert("Hello");
</script>
```
JavaScript
$(document).ready(function() {
alert("Hello");
});
```js
$(document).ready(function() {
alert("Hello");
});
```
SQL
select * from mytable
```sql
select * from mytable
```
Setp9. 超連結與圖片
一般文字超連結
選取文字反白後,將已經複製的連結 Ctrl + v
貼上即可產生文字超連結
載入圖片
選取文字反白後,將已經複製的圖片連結 Ctrl + v
貼上即可產生文字超連結
載入圖片(GitHub)
套過GitHub Issue,可直接截圖後將圖片貼上產生圖片連結
將GitHub Issue產生的圖片連結,直接複製貼回Markdown,即可產生圖片顯示
Setp10. 跳脫字元
Markdown中使用了非常多常用的符號,若想在文件當中插入普通的符號需透過跳脫字源反斜線 \
來幫助。
Setp11. 大綱產生方法
透過Markdown All in One提供的 Create Table of Contents
快速產生整份文件大綱
- 參考文章