文章目錄
自定義簡單模板
@[toc]
## 二級標題
  
## 待補充
  
### 待補充
  
<br/>
> []()
[]()
<img src="" width="80%"/>
<img src="#pic_center" width="80%"/>
<img src="#pic_right" width="80%"/>
<center>文字居中</center>
數學公式粗體$\textbf{}$或者${\bf memory}$
數學公式粗斜體$\bm{}$
> [摘錄自“bookname_author”](鏈接)
<font color=#00aedb>高亮顏色說明</font>:突出重點
<font color=#c3cb71>個人覺得,</font>:待覈準個人觀點是否有誤
分割線
---
分割線
<br/>
<font color=#f37735>我是顏色爲00ffff的字體</font>
<br/>
<font size=2>我是字號爲2的字體</font>
<br/>
<font color=#f37735 size=2>我是顏色爲00ffff, 字號爲2的字體</font>
<br/>
<font face="微軟雅黑" color=#f37735 size=2>我是字體類型爲微軟雅黑, 顏色爲00ffff, 字號爲2的字體</font>
<br/>
段落設置
Markdown首行縮進
由於Markdown語法主要考慮的是英文,所以對於中文的首行縮進並不太友好,兩種方法都可以完美解決這個問題。
- 把輸入法由半角改爲全角。兩次空格之後就能夠有兩個漢字的縮進。“Shift+空格”鍵可以將輸入法從半角切換至全角,此時可以在Markdown編輯器中輸入空格,每個空格正好是一個漢字寬度,首行縮進只需鍵入2下空格即可。
- 在開頭的時候,先輸入下面的代碼,然後緊跟着輸入文本即可。分號也不要掉。直接寫:
- 一個漢字的縮進/全方大的空白:
 
或 
(實現首行縮進需要2個) - 半個漢字的縮進/半方大的空白:
 
或 
(實現首行縮進需要4個) - 一個英文字符的縮進/不斷行的空白格:
或 
(推薦採用上面兩種)
- 一個漢字的縮進/全方大的空白:
  或者  
    或者    
或者        
Markdown強制換行
方法 | 命令 | 備註 |
---|---|---|
鍵盤 | 空格鍵+空格鍵+回車鍵 | 製表不可用 |
命令 | <br>或</br> 或<br /> |
<br /> 中的br和/之間有1個空格 |
命令 | <br/> |
<br/> 中的br和/之間沒有空格 【2018.09.12更正】 |
CSDN-markdown頁內跳轉、頁間跳轉
通過heading實現頁內跳轉
// 創建一個id名稱爲heading_001的heading,作爲位置標記
<h1 id="heading_001">“標題001”</h1>
// 創建一個href名稱也爲heading_001的鏈接,並且使用target="_self"參數來避免新開窗口
<a href="#heading_001" target="_self">點擊本行即會跳轉到“標題001”處</a>
通過錨點實現頁內跳轉、頁間跳轉:定義位置標記, 創建錨點
“anchor”一詞即爲錨點,其在W3C標準中的解釋爲:資源中的某個區域可以是零個、一個或多個鏈接的目標或源。錨點可以引用整個資源,或者資源的特定部分,或者資源的特定表現形式。
錨點是網頁製作中超級鏈接的一種,又叫命名錨記。錨點像一個迅速定位器一樣,是一種頁面內的超級鏈接。
使用錨點可以在文檔中設置位置標記,這些位置標記通常放在文檔的特定主題處或頂部。然後可以創建鏈接到這些位置標記的錨點,這些錨點鏈接可快速將訪問者帶到指定位置。
創建到位置標記的錨點鏈接的過程通常分爲兩步:首先,創建位置標記;然後,創建鏈接到該位置標記的錨點。
// 定義錨點的格式如下:
[錨點鏈接名稱](#錨點鏈接地址,必須是英文半角字符 "錨點鏈接的說明提示,即鼠標移動到錨點鏈接上所顯示的內容")
// 例如,
[錨點鏈接名稱(帶提示)](#anchor_000 "錨點鏈接到的目標位置")
[錨點鏈接名稱(不帶提示)](#anchor_000)
錨點鏈接名稱(帶提示)
錨點鏈接名稱(不帶提示)
點擊該錨點即會跳轉到“位置001”處
點擊該錨點即會跳轉到“位置002”處
// 通過錨點實現頁內跳轉、頁間跳轉的方式一
// 創建一個id名稱爲anchor_001的位置標記
<a id="anchor_001">“位置001”</a>
// 創建一個錨點鏈接地址爲anchor_001的錨點
[點擊該錨點即會跳轉到“位置001”處](#anchor_001 "鏈接到目標位置001")
// 通過錨點實現頁內跳轉、頁間跳轉的方式二
// 創建一個id名稱爲anchor_002的位置標記
<div id="anchor_002"></div>“位置002” 或者 <div id="anchor_002">“位置002”</div>
// 創建一個錨點鏈接地址爲anchor_002的錨點
[點擊該錨點即會跳轉到“位置002”處](#anchor_002 "鏈接到目標位置002")
“位置002”
文本設置
CSDN-markdown文字居中
<center>文字居中</center>
<center>*文字斜體居中*</center> # 沒效果
<center>**文字加粗居中**</center> # 沒效果
<div align='center'><font size='4'>文字居中,並設置字號爲1~7</font></div>
加粗文本
- 加粗方法一:使用兩側加星號
**加粗**
- 加粗方法二:使用strong標籤
<strong>加粗</strong>
- 加粗方法三:使用b標籤
<b>加粗</b>
**加粗**
<strong>加粗</strong>
<b>加粗</b>
<h1><font face="Arial black">“A heading”</font></h1>
其它:使用h加粗標籤<h1><font face="Arial black">“A heading”</font></h1>
的效果
“A heading”
調節字體、字號、顏色
csdn如何修改文字體及顏色_markdown_YZY_001的博客 20181226
Markdown是一種可以使用普通文本編輯器編寫的標記語言,通過類似HTML的標記語法,它可以使普通文本內容具有一定的格式。但是它本身是不支持修改字體、字號與顏色等功能的!
CSDN-markdown編輯器是其衍生版本,擴展了Markdown的功能(如表格、腳註、內嵌HTML等等)!對,就是內嵌HTML,接下來要講的功能就需要使用內嵌HTML的方法來實現。
我是默認設置的字體
<font face="黑體">我是字體類型爲黑體的字體</font>
<font face="微軟雅黑">我是字體類型爲微軟雅黑的字體</font>
<font face="STCAIYUN">我是字體類型爲華文彩雲的字體</font>
<br/>
<font color=#00ffff size=4>我是顏色爲#00ffff, 字號爲4的字體</font>
<br/>
<font color=#0099ff size=7 face="黑體">我是顏色爲#0099ff, 字號爲4的字體</font>
<br/>
<font color=gray size=72>我是顏色爲gray, 字號爲72的字體,但字號超出1~7範圍</font>
<br/>
- face設置調節字體類型;
- color設置字體顏色,
- size設置字體大小,可能的取值:從 1 到 7 的數字,瀏覽器默認值是 3;
上述設置的呈現效果如下:
Markdown數學公式
中英文混排,排版
排版注意事項節選
待補充
配色方案
Metro UI Colors Color Palette
系列色——十六進制顏色碼:#d11141 - #00b159 - #00aedb - #f37735 - #ffc425
系列色——RGB顏色值:
(209,17,65) - (0,177,89) - (0,174,219) - (243,119,53) - (255,196,37)
Pastel Colors Color Palette
系列色——十六進制顏色碼:#1b85b8 - #5a5255 - #559e83 - #ae5a41 - #c3cb71
系列色——RGB顏色值:
(27,133,184) - (90,82,85) - (85,158,131) - (174,90,65) - (195,203,113)
Echarts中的一組顏色
r_hex = '#dc2624' # red, RGB = 220,38,36
dt_hex = '#2b4750' # dark teal, RGB = 43,71,80
tl_hex = '#45a0a2' # teal, RGB = 69,160,162
r1_hex = '#e87a59' # red, RGB = 232,122,89
tl1_hex = '#7dcaa9' # teal, RGB = 125,202,169
g_hex = '#649E7D' # green, RGB = 100,158,125
o_hex = '#dc8018' # orange, RGB = 220,128,24
tn_hex = '#C89F91' # tan, RGB = 200,159,145
g50_hex = '#6c6d6c' # grey-50, RGB = 108,109,108
bg_hex = '#4f6268' # blue grey, RGB = 79,98,104
g25_hex = '#c7cccf' # grey-25, RGB = 199,204,207
“復古”系列色
系列色——十六進制顏色碼:
0780cf - 765005 - fa6d1d - 0e2c82 - b6b51f - da1f18 - 701866 - f47a75 - 009db2 - 024b51 - 0780cf - 765005
系列色——RGB顏色值:
(7,128,207) - (118,80,5) - (250,109,29) - (14,44,130) - (182,181,31) - (218,31,24) - (112,24,102) - (244,122,117) - (0,157,178) - (2,75,81) - (7,128,207) - (118,80,5)
其它配色
CSDN-markdown圖片設置
圖片大小設置
通過使用 HTML Markup 中的<img src="">
插入圖片,而不是 Markdown中的![]()
插入圖片 來實現。步驟如下:
- 在CSDN編輯器中點擊上傳圖片按鈕(Ctrl+Shift+G)上傳圖片到CSDN圖片服務器,得到“CSDN圖片服務器自動生成的圖片地址鏈接”;
![這裏寫圖片描述](CSDN圖片服務器自動生成的圖片地址鏈接)
- 使用以下代碼替換上述代碼即可;
<img src="*.png" alt="img_name.png(顯示在博客中的圖片名稱)" width="300或80%" height=""> # 貌似沒法顯示圖片名稱
# 鎖定縱橫比,按比例縮放
<img src="CSDN圖片服務器自動生成的圖片地址鏈接" width="80%"/>
<img src="CSDN圖片服務器自動生成的圖片地址鏈接" width="80%" alt="圖片名稱"/> # 貌似沒法顯示圖片名稱
# 自定義圖片的寬和高
<img src="CSDN圖片服務器自動生成的圖片地址鏈接" width = "300" height = "200">
<img src="CSDN圖片服務器自動生成的圖片地址鏈接" width = "300" height = "200" alt="圖片名稱"/> # 貌似沒法顯示圖片名稱
圖片對齊方式設置
- 圖片默認居左
- 在src鍵值“圖片地址鏈接”的末尾加上#pic_center即可使圖片居中
- 在src鍵值“圖片地址鏈接”的末尾加上#pic_right即可使圖片居右
<img src="" width="80%"/>
<img src="#pic_center" width="80%"/>
<img src="#pic_right" width="80%"/>
<img src="?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L05lWFRfVm95YWdlcg==,size_16,color_FFFFFF,t_70" width="80%"/>
在src鍵值的?前面插入“圖片地址鏈接”即可使圖片居左(默認)
<img src="?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L05lWFRfVm95YWdlcg==,size_16,color_FFFFFF,t_70#pic_center" width="80%"/>
在src鍵值的?前面插入“圖片地址鏈接”即可使圖片居中
<img src="?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L05lWFRfVm95YWdlcg==,size_16,color_FFFFFF,t_70#pic_right" width="80%"/>
在src鍵值的?前面插入“圖片地址鏈接”即可使圖片居右
待補充
待補充
顏色名索引
顏色名索引
紅色和粉紅色,以及它們的16進制代碼。 | |||||||||
#990033 | #CC6699 | #FF6699 | #FF3366 | #993366 | #CC0066 | #CC0033 | #FF0066 | #FF0033 | ..#CC3399.. |
#FF3399 | #FF9999 | #FF99CC | #FF0099 | #CC3366 | #FF66CC | #FF33CC | #FFCCFF | #FF99FF | #FF00CC |
紫紅色,以及它們的16進制代碼。 | |||||||||
#FF66FF | #CC33CC | #CC00FF | #FF33FF | #CC99FF | #9900CC | #FF00FF | #CC66FF | #990099 | #CC0099 |
#CC33FF | #CC99CC | #990066 | #993399 | #CC66CC | #CC00CC | #663366 | |||
藍色,以及它們的16進制代碼。 | |||||||||
#660099 | #666FF | #000CC | #9933CC | #666699 | #660066 |
#333366 |
#0066CC | #9900FF | #333399 |
#99CCFF | #9933FF | #330099 | #6699FF | #9966CC | #3300CC | #003366 | #330033 | #3300FF | #6699CC |
#663399 | #3333FF | #006699 | #6633CC | #3333CC | #3399CC | #6600CC | #0066FF | #0099CC | #9966FF |
#0033FF | #66CCFF | #330066 | #3366FF | #3399FF | #6600FF | #3366CC | #003399 | #6633FF | #000066 |
#0099FF | #CCCCFF | #000033 | #33CCFF | #9999FF | #0000FF | #00CCFF | #9999CC | #000099 | #6666CC |
#0033CC | |||||||||
黃色、褐色、玫瑰色和橙色,以及它們的16進制代碼。 | |||||||||
#FFFFCC | #FFCC00 | #CC99090 | #663300 | #FF6600 | #663333 | #CC6666 | #FF6666 | #FF0000 | #FFFF99 |
#FFCC66 | #FF9900 | #FF9966 | #CC3300 | #996666 | #FFCCCC | #660000 | #FF3300 | #FF6666 | #FFCC33 |
#CC6600 | #FF6633 | #996633 | #CC9999 | #FF3333 | #990000 | #CC9966 | #FFFF33 | #CC9933 | #993300 |
#FF9933 | #330000 | #993333 | #CC3333 | #CC0000 | #FFCC99 | #FFFF00 | #996600 | #CC6633 | |
綠色,以及它們的16進制代碼。 | |||||||||
#99FFFF | #33CCCC | #00CC99 | #99FF99 | #009966 | #33FF33 | #33FF00 | #99CC33 | #CCC33 | #66FFFF |
#66CCCC | #66FFCC | #66FF66 | #009933 | #00CC33 | #66FF00 | #336600 | #33300 | #33FFFF | #339999 |
#99FFCC | #339933 | #33FF66 | #33CC33 | #99FF00 | #669900 | #666600 | #00FFFF | #336666 | #00FF99 |
#99CC99 | #00FF66 | #66FF33 | #66CC00 | #99CC00 | #999933 | #00CCCC | #006666 | #339966 | #66FF99 |
#CCFFCC | #00FF00 | #00CC00 | #CCFF66 | #CCCC66 | #009999 | #003333 | #006633 | #33FF99 | #CCFF99 |
#66CC33 | #33CC00 | #CCFF33 | #666633 | #669999 | #00FFCC | #336633 | #33CC66 | #99FF66 | #006600 |
#339900 | #CCFF00 | #999966 | #99CCCC | #33FFCC | #669966 | #00CC66 | #99FF33 | #003300 | #99CC66 |
#999900 | #CCCC99 | #CCFFFF | #33CC99 | #66CC66 | #66CC99 | #00FF33 | #009900 | #669900 | #669933 |
#CCCC00 | |||||||||
白色、灰色和黑色,以及它們的16進制代碼。 | |||||||||
#FFFFF | #CCCCCC | #999999 | #666666 | #333333 | #000000 | ||||
16色和它們的16進制代碼。 | |||||||||
Aqua | Black | Fuchsia | Gray | Gree | Lime | Maroon | Navy | Olive | Purple |
Red | Silver | Teal | White | Yellow | Blue |
待補充
待補充