寫公眾號有一年半了，從最初用word寫到轉(zhuǎn)換為用markdown。在這個過程中陈惰，倍受折磨的就是微信公眾號的排版，幾乎每次的排版都花費寫作時間的兩倍纤掸。

既然公眾號排版如此浪費時間，有沒有什么辦法可以一勞永逸呢浑塞？我試了很多種編輯器借跪，用下來都差不多，決定另辟它徑酌壕。

李笑來在他的“學(xué)習(xí)學(xué)習(xí)再學(xué)習(xí)”里寫過他排版的方法掏愁，用markhere插件渲染歇由，他把他編寫的markhere的css文件放在了github里，可是我一直沒有打開他的鏈接果港。

我嘗試用這個辦法沦泌，遺憾的是我一直沒有學(xué)會怎么科學(xué)上網(wǎng)，markhere安裝不了辛掠，在safari上安裝了也用不了谢谦，還得另想辦法。

最后在簡書上搜到一篇文章markdown兩鍵排版微信公眾號文章萝衩，用這個辦法我解決了排版的問題回挽。

這篇文章詳細(xì)介紹了MarkEditor軟件的用法，并且給出了排版風(fēng)格的css文件:

p{font-size:15px; line-height:28px; color:#595959;font-family:微軟雅黑}
pre, code{font-size:14px; font-family: Roboto, 'Courier New', Consolas, Inconsolata, Courier, monospace;}
code{margin:0 3px; padding:0 6px; white-space: pre-wrap; background-color:#F8F8F8; border-radius:2px; display: inline;}
pre{font-size:15px; line-height:20px;}
precode{white-space: pre; overflow:auto; border-radius:3px; padding:5px10px; display: block !important;}
strong, b{color:#BF360C;}
em, i{color:#009688;}
big{font-size:22px; color:#009688; font-weight: bold; vertical-align: middle; border-bottom:1px solid #eee;}
small{font-size:12px; line-height:22px;}
hr{border-bottom:0.05em dotted #eee; margin:10px auto;}
p{margin:15px 5px!important;}
table, pre, dl, blockquote, q, ul, ol{margin:10px 5px;}
ul, ol{padding-left:10px;}
li{margin:5px;}
lip{margin:5px 0!important;}
ulul, ulol, olul, olol{margin:0; padding-left:10px;}
olol, ulol{list-style-type: lower-roman;}
ululol, ulolol, olulol, ololol{list-style-type: lower-alpha;}
dl{padding:0;}
dldt{font-size:1em; font-weight: bold; font-style: italic;}
dldd{margin:0 0 10px; padding:0 10px;}
blockquote, q{border-left:3px solid #009688; padding:0 10px; color:#777; quotes: none;}
blockquote::before, blockquote::after, q::before, q::after{content: none;}
h1, h2, h3, h4, h5, h6{margin:20px 0 10px; padding:0; font-weight: bold; color:#009688;}
h1{font-size:24px; border-bottom:1px solid #ddd;}
h2{font-size:22px; border-bottom:1px solid #eee;}
h3{font-size:18px; text-align: center;}
h4{font-size:18px;}
h5{font-size:16px;}
h6{font-size:16px; color:#777;}
table{padding:0; border-collapse: collapse; border-spacing:0; font-size:1em; font: inherit; border:0;}
tbody{margin:0; padding:0; border:0;}
tabletr{border:0; border-top:1px solid #CCC; background-color: white; margin:0; padding:0;}
tabletr:nth-child(2n){background-color:#F8F8F8;}
tabletrth, tabletrtd{font-size:16px; border:1px solid #CCC; margin:0; padding:5px10px;}
tabletrth{font-weight: bold; background-color:#F0F0F0;}

將此文件復(fù)制到MarkEditor軟件中的下方空白處——“將需要注入的css樣式填入這里”就OK猩谊。按照這個樣式出來的文章雖然也很漂亮千劈，但我卻希望文章顯示的時候能夠居中一些，不要那么靠邊牌捷。因此墙牌，我在這個css文件的基礎(chǔ)上，稍微做了更改宜鸯。

我增加了這樣幾行:

p{padding:0 10px 0 17px;}
blockquote q{background-color:#f8f8ff}

同時憔古，將

blockquote, q{border-left:3px solid #009688; padding:0 10px; color:#777; quotes: none;}

改為

blockquote, q{border-left:3px solid #009688; padding:0 3px; color:#777; quotes: none;}

最后的css文件是：

p{padding:0 10px 0 17px}
p{font-size:16px; line-height:28px; color:#595959;font-family:微軟雅黑}
pre, code{font-size:14px; font-family: Roboto, 'Courier New', Consolas, Inconsolata, Courier, monospace;}
code{margin:0 3px; padding:0 6px; white-space: pre-wrap; background-color:#F8F8F8; border-radius:2px; display: inline;}
pre{font-size:15px; line-height:30px;}
precode{white-space: pre; overflow:auto; border-radius:3px; padding:5px10px; display: block !important;}
strong, b{color:#BF360C;}
em, i{color:#009688;}
big{font-size:22px; color:#009688; font-weight: bold; vertical-align: middle; border-bottom:1px solid #eee;}
small{font-size:12px; line-height:22px;}
hr{border-bottom:0.05em dotted #eee; margin:10px auto;}
p{margin:15px 5px!important;}
table, pre, dl, blockquote, q, ul, ol{margin-left:22px; padding-left:0; margin-right:20px;}
ul, ol{padding-left:10px;}
li{margin:5px;}
lip{margin:5px 0!important;}ulul, ulol, olul, olol{margin:0; padding-left:10px;}
olol, ulol{list-style-type: lower-roman;}
ululol, ulolol, olulol, ololol{list-style-type: lower-alpha;}
dl{padding:0;}
dldt{font-size:1em; font-weight: bold; font-style: italic;}
dldd{margin:0 0 10px; padding:0 10px;}
blockquote, q{border-left:3px solid #009688; margin-left:22px; padding-left:0; margin-right:20px;color:#777; quotes: none;}
blockquote,q{background-color:#f8f8ff;}
blockquote::before, blockquote::after, q::before, q::after{content: none;}
h1, h2, h3, h4, h5, h6{margin:20px 0 10px; padding:0; font-weight: bold; color:#009688;}
h1,h2,h3{text-align: center;}
h1{font-size:24px;}
h2{font-size:22px;}
h3{font-size:21px;}
h4{font-size:19px;margin-left:22px; margin-right:20px}
h5{font-size:18px;margin-left:22px; margin-right:20px}
h6{font-size:17px; color:#009688;margin-left:22px; margin-right:20px}
table{padding:0; border-collapse: collapse; border-spacing:0; font-size:15px; font: inherit; border:0;text-align: center;margin-left:22px; margin-right:20px;}
tbody{margin-left:22px; margin-right:20px;}
tabletr{border:0; border-top:1px solid #CCC; background-color: white; margin:0; padding:0;}
tabletr:nth-child(2n){background-color:#F8F8F8;}
tabletrth, tabletrtd{font-size:15px; border:1px solid #CCC; margin:0; padding:5px10px;}
tabletrth{font-weight: bold; background-color:#F0F0F0;}

做了這些調(diào)整以后遮怜，出來的文本不太靠邊淋袖，相對要好看一點。

現(xiàn)在一直這樣排版锯梁，不那么麻煩了即碗。