【2021-10-04】連嶽摘抄
Markdown語法介紹
Markdown 是一種輕量級標記語言,它允許人們使用易讀易寫的純文字格式編寫文件。 它允許人們使用易讀易寫的純文字格式編寫文件,然後轉換成有效的XHTML(或者HTML)文件。這種語言吸收了很多在電子郵件中已有的純文字標記的特性。
由於Markdown的輕量化、易讀易寫特性,並且對於圖片,圖表、數學式都有支援,許多網站都廣泛使用Markdown來撰寫幫助文件或是用於論壇上發表訊息。 如GitHub等等。
接下來,我主要從一下這8個方面來介紹一下markdown的常用方法,最後在進行一些特殊的補充。
1.標題
對應標題的語法形式
# 一級標題 ## 二級標題 ### 三級標題 #### 四級標題 ##### 五級標題 ###### 六級標題
效果展示
一級標題
二級標題
三級標題
四級標題
五級標題
六級標題
2.字型
對應字型的語法程式碼
*這是斜體*
**這是粗體**
***這是粗斜體***
~~這是刪除~~
效果展示
這是斜體
這是粗體
這是粗斜體
這是刪除
3.程式碼塊
對應程式碼塊的語法程式碼
```對應的語言,如bash,c++,c,java
```
效果展示
#include <iostream> using namespace std; int main() { cout << "hello world!" << endl; return 0; }
4.列表
列表主要分為有序列表和無序列表,這裡再簡要介紹一下列表的巢狀
有序列表、無序列表的語法
- 無序列表1
- 無序列表2
- 無序列表3
1. 有序列表1
2. 有序列表2
3. 有序列表3
- 無序列表1
- 無序列表2
- 無序列表3
- 有序列表1
- 有序列表2
- 有序列表3
因為列表比較常用,這裡再介紹一下容易遇到的列表巢狀
列表巢狀語法
列表巢狀需要在子列表中的選項前面新增四個空格
1. 主列表1
- 兒子列表
- 孫子列表
2. 主列表2
- 主列表1
- 兒子列表
- 孫子列表
- 兒子列表
- 主列表2
5.引用
因為也是我們寫文章常用的東西,引用和列表可以相互巢狀,引用也可以自己巢狀,對應演示如下所示
引用程式碼
> 這是最外層引用
>> 這是第二層引用
>>> 這是第三層引用
>>>> 這是第四層引用
這是最外層引用
這是第二層引用
這是第三層引用
這是第四層引用
引用巢狀列表
- 有序列表1
- 有序列表2
- 有序列表3
- 無序列表
- 列表巢狀引用
這是尚未引用部分這是引用部分
- 列表
6.表格
表格語法
| head1 | head2 |
| ---- | ---- |
| value1 | value2 |
| value3 | value4 |
| 左對齊 | 右對齊 | 居中對齊 |
| :-----| ----: | :----: |
| 單元格 | 單元格 | 單元格 |
| 單元格 | 單元格 | 單元格 |
效果展示
cnblogs上對md表格語法支援還是有點問題的,在typora上你沒有問題
head1 | head2 |
---|---|
value1 | value2 |
value3 | value4 |
左對齊 | 右對齊 | 居中對齊 |
---|---|---|
單元格 | 單元格 | 單元格 |
單元格 | 單元格 | 單元格 |
7.圖片與超連結
對應圖片、超連結語法
圖片: ![this_is_a_photo_link](https://pic.cnblogs.com/avatar/1772262/20200523104724.png)
超連結: [this_is_a_link_to_baidu](www.baidu.com)
該連結無法跳轉到百度,我會在第九點進行講解
效果展示
圖片:
超連結: this_is_a_link_to_baidu
8.分割線
分割線的語法
***
---
效果展示
cnblogs上對md表格語法支援還是有點問題的,同樣在typora上你沒有問題
9.特殊點
對應的html和css語法,方便細緻的處理
- 字型渲染的css用法
我們寫部落格或者是文章,最最最常用的就是字型渲染,md語法中提供的渲染效果較為單一,這裡推薦使用 css 語法中的字型渲染css 程式碼
<div style="color:#B22222;font-weight:bold;font-size:14px">這是css文字渲染</div>
渲染效果
- 關於圖片大小設定的問題
這裡主要還是需要藉助css Img 標籤進行設定
<img src="url" style="zoom:縮放比例" />
-
關於 [](跳轉地址)無法跳轉的問題
不難得知,我們跳轉的 url 為 www.baidu.com,但是在cnblogs 中,他自動給我們加入了字首,變成了
https://i.cnblogs.com/www.baidu.com
使用 html 的標籤,檢視效果一致,考慮加上字首,解決!<a href="地址">文字描述</a>
-
文字居中的效果
<p align="center">居中的文字,可以巢狀其他語法</p> <div style="color:blue;text-align:center;font-size:14px;font-weight:bold">居中文字</div>
文字居中
居中文字 數學公式的書寫,放在下一篇部落格