【MarkDown】使用Html樣式和摺疊語法

MarkDown很方便,但基本語法有些不足:好比沒法使用摺疊語法,沒法讓文字有不一樣的顏色。html

這些功能能夠實現,不過須要使用Html語法進行擴展。這篇文章主要是整理一下這些技巧,方便更好的使用。git

1、摺疊語法:<details>標籤

1.一、代碼:

<details>
  <summary>點擊時的區域標題:點擊查看詳細內容</summary>
  <p> - 測試 測試測試</p>
  <pre><code>  title,value,callBack能夠缺省  </code>  </pre>
</details>

summary:摺疊語法展現的摘要github

details:摺疊語法標籤ruby

pre:以原有格式顯示元素內的文字是已經格式化的文本。markdown

blockcode:表示程序的代碼塊。測試

code:指定代碼範例。字體

1.二、實際效果:


點擊時的區域標題:點擊查看詳細內容

- 測試 測試測試spa


  title,value,callBack能夠缺省

2、其餘HTML語法:

2.1 源碼:

<span style='color:red'>This is red</span>   //字體顏色
<ruby> 漢 <rt> ㄏㄢˋ </rt> </ruby> // 特殊字
<kbd>Ctrl</kbd>+<kbd>F9</kbd>  // 按鍵標識
<span style="font-size:2rem; background:yellow;">**Bigger**</span> //字體大小和背景

<font face="微軟雅黑" color="red" size="6">字體及字體顏色和大小</font>
<font color="#0000ff">字體顏色</font>

<p align="left">居左文本</p>
<p align="center">居中文本</p>
<p align="right">居右文本</p>

使用span或者font標籤,同時用style屬性控制樣式。code

2.2 實際效果:


This is redhtm

ㄏㄢˋ
Ctrl+F9

Bigger


字體及字體顏色和大小
字體顏色


居左文本

居中文本

居右文本

3、參考來源:

  1. markdown嵌入摺疊標籤 | 東引甌越 https://www.sunyazhou.com/2017/10/25/20171025markdown-skill/
  2. 讓你的md文檔可摺疊化展現 · Issue #155 · iuap-design/blog https://github.com/iuap-design/blog/issues/155 (比上一個好點的感受)
  3. HTML Support in Typora https://support.typora.io/HTML/#html-entities (其餘的HTML語法和使用)
  4. Markdown的經常使用語法(我的總結) | ConnorLin's Blog http://connorlin.github.io/2016/05/06/Markdown%E7%9A%84%E5%B8%B8%E7%94%A8%E8%AF%AD%E6%B3%95(%E4%B8%AA%E4%BA%BA%E6%80%BB%E7%BB%93)/
相關文章
相關標籤/搜索