【4】寫博客神器——Markdown(附工具推薦)

本文是《程序猿叨叨叨》系列文章中的其中一篇寨蹋,想要了解更多相關(guān)的文章,歡迎猛戳藍字前往閱讀。

標(biāo)題

標(biāo)題可根據(jù)字體的大小分為六個級別吼具,分別用若干個#表示。

【效果】

這是一級標(biāo)題

這是二級標(biāo)題

這是三級標(biāo)題

這是四級標(biāo)題

這是五級標(biāo)題
這是六級標(biāo)題

【輸入】

# 這是一級標(biāo)題
## 這是二級標(biāo)題
### 這是三級標(biāo)題
#### 這是四級標(biāo)題
##### 這是五級標(biāo)題
###### 這是六級標(biāo)題

文本

文本的顯示形式可分為粗體矩距、斜體兩種拗盒,通過在文本前后輸入若干個*

【效果】
這是粗體
這是斜體
這是斜體+粗體

【輸入】

**這是粗體**
*這是斜體*
***這是斜體+粗體***

圖片

圖片的輸入語法為:
![圖片內(nèi)容](圖片鏈接)

【效果】

我的簡書個人主頁

【輸入】

![我的簡書個人主頁](http://upload-images.jianshu.io/upload_images/291600-f1aa74cf4c14c6c0.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)

注意:這里的!锥债、[陡蝇、](哮肚、)均為英文輸入法登夫,且簡書平臺Markdown編輯器只要將圖片文件拖入輸入?yún)^(qū)域,即可生成Markdown文本允趟,讀者們只要修改描述圖片的文本即可恼策。

如果輸入的圖片鏈接找不到圖片,其效果為:

[圖片上傳失敗...(image-bdb578-1532051459825)]

除了靜態(tài)圖片拼窥,Markdown支持Gif動圖:

【效果】


動圖效果

【輸入】

![動圖效果](http://upload-images.jianshu.io/upload_images/291600-3b00271942fef854.gif?imageMogr2/auto-orient/strip)

鏈接

鏈接的語法與圖片類似戏蔑,只要在圖片的基礎(chǔ)上去掉!即可。

【效果】

這個是簡書平臺的鏈接

【輸入】

[這個是簡書平臺的鏈接](http://jianshu.com)

列表

列表可分為有序列表無序列表鲁纠。

無序列表可通過在每行文本前輸入*总棵、+-來實現(xiàn)改含。

【效果】

  • 星號實現(xiàn)的列表
  • 記得符號與文本之間有一個空格
  • 減號實現(xiàn)的列表
  • 加號實現(xiàn)的列表

【輸入】

* **星號**實現(xiàn)的列表
* 記得符號與文本之間有一個**空格**
- **減號**實現(xiàn)的列表
+ **加號**實現(xiàn)的列表

有序列表可通過在每行文本前面輸入數(shù)字+.+空格來實現(xiàn)情龄。

【效果】

  1. 第一行
    這是第一行的內(nèi)容
  2. 第二行
    這是第二行的內(nèi)容
  3. 第三行
    這是第三行的內(nèi)容
    我是占位行
  4. 第四行
    這是第四行的內(nèi)容

【輸入】

1. 第一行
這是第一行的內(nèi)容
2. 第二行
這是第二行的內(nèi)容
3. 第三行
這是第三行的內(nèi)容
我是占位行
4. 第四行
這是第四行的內(nèi)容

引用

引用即我們文章中摘抄他人文章中寫的內(nèi)容,其可以通過 >來實現(xiàn)。

【效果】

這是一段引用文章的文字骤视,此處省略1000字鞍爱。。专酗。

【輸入】

> 這是一段引用文章的文字睹逃,此處省略1000字。祷肯。沉填。

PS: 因引用文本底色與簡書默認(rèn)文本底色色差明顯,所以筆者以引用作為文章段落的標(biāo)題以明顯區(qū)分文章不同部分佑笋,純屬個人習(xí)慣翼闹。

行內(nèi)代碼塊

行內(nèi)代碼塊可用于關(guān)鍵字詞,將其與普通文本區(qū)分開來蒋纬,其用法為在文字內(nèi)容開始與結(jié)尾添加"`"猎荠。

【效果】

這是行內(nèi)代碼塊

【輸入】

`這是行內(nèi)代碼塊`

代碼塊

代碼塊實則為行內(nèi)代碼快的擴展,用于將多行代碼或文本內(nèi)容與其他文本內(nèi)容區(qū)分開來蜀备,其效果如下:

【效果】

    public int add(int a, int b) {
        return a + b;
    }

【插入】

實際輸入為每一行代碼前面加上4個Tab鍵或8個空格鍵关摇。

注意:簡書的Markdown環(huán)境下,多行代碼前需留出一個空行才能顯示效果琼掠!

加強代碼塊

加強代碼塊是代碼塊的增強版拒垃,省去了多行代碼每行輸入Tab鍵的煩惱,只要在多行代碼的開始和結(jié)尾輸入"```"即可瓷蛙。

【效果】

public int add(int a, int b) {
    return a + b;
}

【輸入】

` ` `
public int add(int a, int b) {
    return a + b;
}
` ` ` // 因為結(jié)尾的三個`在代碼框里不好輸入悼瓮,在`之間用空格隔開,實際沒有空格

表格

表格的語法主要用到的符號為|艰猬、-横堡、:,我們先來看看效果:

【效果】

默認(rèn) 居中 左對齊 右對齊
換行\(zhòng)n換行失敗 簡書Markdown 不支持 換行
支持斜體 粗體 斜體+粗體
# 不支持標(biāo)題 支持鏈接 [圖片上傳失敗...(image-ea8611-1532052436234)] 支持行內(nèi)代碼塊

【輸入】

|默認(rèn)|居中|左對齊|右對齊|
|--|:-:|:-|-:|
|換行\(zhòng)n換行失敗|簡書Markdown|不支持|換行|
|*支持斜體*|**粗體**|***斜體+粗體***||
|# 不支持標(biāo)題|[支持鏈接](http://jianshu.com)|[圖片上傳失敗...(image-fc098c-1532051459826)]|`支持行內(nèi)代碼塊` |

大家可以看到冠桃,表格的第一行默認(rèn)為粗體居中命贴,表格的其他語法,大家看【輸入】+實際操作自己體會吧食听!

刪除線

對于線的顯示胸蛛,Markdown也提供了支持,包括:

【效果】

刪除線

【輸入】

~~刪除線~~

以上是筆者針對最最基本的Markdown用法對其進行了羅列樱报,當(dāng)然讀者們也可以在其他平臺上看到Markdown更加高階的用法葬项,如:cmd Markdown對原聲Markdown進行了更進一步的封裝和擴展,可支持LaTex迹蛤、Todo列表民珍、Toc目錄襟士、Mermaid 序列圖等,Markdown是一個很有意思的工具嚷量,感興趣的小伙伴們可以進行更進一步的探索陋桂!

分割線

分割線可使用*-來實現(xiàn)蝶溶。

【效果】



【輸入】

---
***

附錄一 Markdown工具

Markdown工具可分為在線客戶端兩種嗜历,接下來筆者帶領(lǐng)大家來看看Mac端Markdown熟悉工具。

【在線】

簡書

圖片來自簡書

讀者們?nèi)绻銓?strong>簡書還沒有用過Markdown身坐,筆者強烈推薦你嘗試一下秸脱,相信你會愛上它的落包,正如我之前提到過的部蛇,Markdown讓我放下了CSDN、Lofter的博客平臺咐蝇,提高了我寫文章的速度和頻率涯鲁,讓我從此癡迷其中!

簡書設(shè)置Markdown編輯器方法如下:

圖片來自簡書

點擊齒輪圖標(biāo)有序,進入設(shè)置抹腿;

圖片來自簡書

選擇基礎(chǔ)設(shè)置選項,在下方選擇常用的編輯器選擇Markdown旭寿,然后點擊保存按鈕即可警绩;

圖片來自簡書

簡書Markdown可支持實時預(yù)覽,這個功能帶來了非常棒的用戶體驗盅称,就好比剛開始學(xué)習(xí)Html的小伙伴們肩祥,每輸入一個字符都感覺自己完成了一項成就,贊缩膝!

作業(yè)部落

圖片來自作業(yè)部落

作業(yè)部落這個名字乍一聽混狠,有點學(xué)生氣,有點小學(xué)時候用的錯題本的感覺疾层,但是其功能是非常強大的将饺,支持實時預(yù)覽,對Markdown進行了非常完美的封裝痛黎,正如它說的“Cmd Markdown是世界上最好的Markdown語言”予弧,用這句話形容它應(yīng)該是不為過的,我們來看一下:

它支持
1. Todo列表
2. LaTex公式
3. 簡易流程圖
4. 序列圖
5. 甘特圖
6. TOC目錄
7. 標(biāo)簽分類
8. 注腳
9. Mermaid 流程圖
10. Mermaid 序列圖
11. 定義型列表
12. 內(nèi)嵌圖標(biāo)

可以說湖饱,使用Cmd Markdown完成一篇比較專業(yè)的學(xué)術(shù)論文是沒問題的掖蛤。筆者的Markdown語法就是從這里開始起步的,但是它有一個致命的缺點琉历,就是:

它太完美了坠七,像毒品一樣給人致命的依賴水醋,導(dǎo)致一旦轉(zhuǎn)移到其他Markdown平臺,用戶有一種攀過五岳彪置,從此看其他山都是平地的感覺拄踪。

正因為它封裝地太多,在其他Markdown平臺拳魁,一些功能用不了惶桐,所以筆者丟棄了這個毒品,轉(zhuǎn)向更具有普適性的簡書Markdown潘懊。

PS: 作業(yè)部落同時支持客戶端姚糊,在線同步,可離線保存授舟。

馬克飛象

圖片來自馬克飛象

如果你是印象筆記迷救恨,那么馬克飛象可以說是你的福音了,它支持將文本存到印象筆記释树,且功能特性與作業(yè)部落無幾肠槽,但是有一點讓人遺憾的是:

馬克飛象是一款收費軟件,在10天的試用期結(jié)束后奢啥,只有通過收費才能繼續(xù)使用秸仙!

圖片來自馬克飛象客戶端

PS:同作業(yè)部落一樣,馬克飛象也支持客戶端桩盲,支持本地緩存寂纪。

有道云筆記

圖片來自有道云筆記

或許你聽?wèi)T了有道詞典,這個八竿子打不著的詞典Markdown突然有一天走到一起產(chǎn)生了愛情的火花赌结,誕生出了有道云筆記捞蛋,想想就感覺像吉利收購了沃爾沃,再高端的東西被低端拿下了后多少印象分會大打折扣姑曙。

圖片來自有道云筆記

是的襟交!你沒看錯,這就是有道云筆記伤靠,不得不說捣域,有道支持Markdown確實吸引了不少路人粉。

圖片來自有道云筆記

有一個功能有道云筆記做的確實不錯宴合,就是可以將自己的筆記發(fā)布到網(wǎng)上焕梅,他人可以像瀏覽網(wǎng)頁一樣查看自己的記錄

小書匠

圖片來自小書匠

小書匠是一款內(nèi)容豐富的個性化Markdown編輯工具卦洽,為什么說它個性化呢贞言?我們來看看它的功能:

支持:
1. 全屏預(yù)覽
2. 實時可獲取html代碼
3. 自定義CSS樣式
4. 多方式預(yù)覽:普通預(yù)覽、ppt預(yù)覽阀蒂、pdf預(yù)覽
5. 多種預(yù)覽排版方式:上该窗、下弟蚀、左、右酗失、浮動
6. 內(nèi)容可以標(biāo)題為節(jié)點隱藏
7. 映射關(guān)系
8 大綱查看义钉,自動生成目錄
圖片來自小書匠

土豪金配上經(jīng)典黑就足以閃瞎我們凡人的雙眸,高逼格规肴、高內(nèi)涵捶闸、高血壓高品質(zhì)的Markdown編輯器,你值得擁有拖刃!

PS:這里強調(diào)一下:小書匠支持windows删壮、Linux、Mac兑牡、Web多端編輯央碟!

【客戶端】

除了以上同時支持客戶端的在線Markdown編輯器外,我們來說說其他的客戶端Markdown編輯器发绢。

Mou

圖片來自Mou

Mou是筆者嘗試的第一款Markdown客戶端軟件硬耍,支持最基本的Markdown語法,界面簡潔边酒。因其主題風(fēng)格不是很心儀,后來筆者將它Kill掉了-_-#狸窘,但這并不影響Markdown迷們對它的喜愛墩朦!

MacDown

圖片來自MacDown

MacDown是筆者使用Markdown編輯器以來用的最久的一款,其主題樣式和預(yù)覽效果都還是不錯的翻擒,重要的是:它開源免費氓涣,免費免費陋气,免費劳吠!**

但是它有一個不足,就是:一個窗口只能打開一個文件巩趁,這就顯得比較雞肋了痒玩,后來筆者又將MacDown殺掉了-_-||

Atom

圖片來自Atom

Atom是一款很強大比較成熟穩(wěn)定的一款Markdown編輯器,支持多文件顯示议慰,文件目錄縮進蠢古,有豐富的插件,其插件的下載方式為:

Preferences->install->想要插件的名稱->搜索->下載

然后重啟Atom即可别凹,目前筆者正在使用這款A(yù)PP草讶。

Sublime

圖片來自Sublime

Sublime是一款通用型編輯器。如果說Atom是17世紀(jì)的物理牛頓炉菲,那么Sublime就是15世紀(jì)的全能達芬奇堕战。之所以提到Sublime坤溃,是因為Sublime支持Markdown插件,通過安裝下載嘱丢,Sublime也同樣可以實現(xiàn)Markdown編輯器的效果浇雹,但是它的預(yù)覽還是挺雞肋的,它只能像Html一樣屿讽,在瀏覽器中預(yù)覽昭灵,而且不支持實時預(yù)覽。但是畢竟是老牌編輯器伐谈,強大的通用性讓其在編輯器領(lǐng)域鶴立雞群烂完。

PS: 本文Markdown工具推薦借鑒自:好用的Markdown編輯器一覽,其中還包括windows端和Linux端的工具推薦诵棵,感興趣可以看一下抠蚣!

以上就是筆者對Markdown瀏覽器的推薦,上述每一張圖片(除了Mou)都是筆者重新安裝APP后截圖得到的履澳,有所獲益的讀者們動動小手嘶窄,點個贊唄~

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末,一起剝皮案震驚了整個濱河市距贷,隨后出現(xiàn)的幾起案子柄冲,更是在濱河造成了極大的恐慌,老刑警劉巖忠蝗,帶你破解...
    沈念sama閱讀 217,542評論 6 504
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件现横,死亡現(xiàn)場離奇詭異,居然都是意外死亡阁最,警方通過查閱死者的電腦和手機戒祠,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 92,822評論 3 394
  • 文/潘曉璐 我一進店門,熙熙樓的掌柜王于貴愁眉苦臉地迎上來速种,“玉大人姜盈,你說我怎么就攤上這事∨湔螅” “怎么了馏颂?”我有些...
    開封第一講書人閱讀 163,912評論 0 354
  • 文/不壞的土叔 我叫張陵,是天一觀的道長闸餐。 經(jīng)常有香客問我饱亮,道長,這世上最難降的妖魔是什么舍沙? 我笑而不...
    開封第一講書人閱讀 58,449評論 1 293
  • 正文 為了忘掉前任近上,我火速辦了婚禮,結(jié)果婚禮上拂铡,老公的妹妹穿的比我還像新娘壹无。我一直安慰自己葱绒,他們只是感情好,可當(dāng)我...
    茶點故事閱讀 67,500評論 6 392
  • 文/花漫 我一把揭開白布斗锭。 她就那樣靜靜地躺著地淀,像睡著了一般。 火紅的嫁衣襯著肌膚如雪岖是。 梳的紋絲不亂的頭發(fā)上帮毁,一...
    開封第一講書人閱讀 51,370評論 1 302
  • 那天,我揣著相機與錄音豺撑,去河邊找鬼烈疚。 笑死,一個胖子當(dāng)著我的面吹牛聪轿,可吹牛的內(nèi)容都是我干的爷肝。 我是一名探鬼主播,決...
    沈念sama閱讀 40,193評論 3 418
  • 文/蒼蘭香墨 我猛地睜開眼陆错,長吁一口氣:“原來是場噩夢啊……” “哼灯抛!你這毒婦竟也來了?” 一聲冷哼從身側(cè)響起音瓷,我...
    開封第一講書人閱讀 39,074評論 0 276
  • 序言:老撾萬榮一對情侶失蹤对嚼,失蹤者是張志新(化名)和其女友劉穎,沒想到半個月后外莲,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體猪半,經(jīng)...
    沈念sama閱讀 45,505評論 1 314
  • 正文 獨居荒郊野嶺守林人離奇死亡,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點故事閱讀 37,722評論 3 335
  • 正文 我和宋清朗相戀三年偷线,在試婚紗的時候發(fā)現(xiàn)自己被綠了。 大學(xué)時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片沽甥。...
    茶點故事閱讀 39,841評論 1 348
  • 序言:一個原本活蹦亂跳的男人離奇死亡声邦,死狀恐怖,靈堂內(nèi)的尸體忽然破棺而出摆舟,到底是詐尸還是另有隱情亥曹,我是刑警寧澤,帶...
    沈念sama閱讀 35,569評論 5 345
  • 正文 年R本政府宣布恨诱,位于F島的核電站媳瞪,受9級特大地震影響,放射性物質(zhì)發(fā)生泄漏照宝。R本人自食惡果不足惜蛇受,卻給世界環(huán)境...
    茶點故事閱讀 41,168評論 3 328
  • 文/蒙蒙 一、第九天 我趴在偏房一處隱蔽的房頂上張望厕鹃。 院中可真熱鬧兢仰,春花似錦乍丈、人聲如沸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 31,783評論 0 22
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽。三九已至察蹲,卻和暖如春请垛,著一層夾襖步出監(jiān)牢的瞬間,已是汗流浹背洽议。 一陣腳步聲響...
    開封第一講書人閱讀 32,918評論 1 269
  • 我被黑心中介騙來泰國打工宗收, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留,地道東北人绞铃。 一個月前我還...
    沈念sama閱讀 47,962評論 2 370
  • 正文 我出身青樓镜雨,卻偏偏與公主長得像,于是被迫代替她去往敵國和親儿捧。 傳聞我的和親對象是個殘疾皇子荚坞,可洞房花燭夜當(dāng)晚...
    茶點故事閱讀 44,781評論 2 354

推薦閱讀更多精彩內(nèi)容