作為一個工程師，追求極致與藝術(shù)也應(yīng)當成為我們生活中的一部分，作為自己的心愛之物——博客，當然也得裝扮一下，我對代碼高亮有自己所喜歡的風格~還好程序員的世界總是共通的，已經(jīng)有前輩開發(fā)了一些代碼高亮的樣式可供我們開箱即用。Highlightjs就是這樣一款產(chǎn)品。

下面介紹一下我是如何將這款產(chǎn)品應(yīng)用于博客園markdown編輯器中的。

第一步，找到你所喜歡的高亮主題

打開Hightlightjs的demo頁面 選擇你所喜歡的高亮主題。我選擇的是Atom One Dark Reasonable這個主題。

圖1 在Hightlight中挑選自己喜歡的高亮主題

第二步，下載對應(yīng)高亮主題的源碼

到GitHub找到Hightlight對應(yīng)主題的源碼：highlightjs/highlight.js代碼高亮主題名稱與Github中的css代碼名稱一一對應(yīng)。比如我選擇的主題名稱為Atom One Dark Reasonable，其對應(yīng)的css代碼為：atom-one-dark-reasonable.css，打開相應(yīng)代碼，將其源碼復制并保存到本地即可。

圖2 在GitHub下載高亮主題相應(yīng)的css源碼

第三步，修改css代碼以適應(yīng)cnblogs的markdown語法高亮樣式

用UltraEdit編輯器打開剛剛下載的css源碼，將 .hljs替換為 .cnblogs-markdown .hljs 選擇 替換->當前文件->全部替換

圖3 將 .hljs替換為 .cnblogs-markdown .hljs

第四步，將處理后的css代碼復制到博客園頁面定制css代碼欄中

博客園管理頁面->設(shè)置->頁面定制CSS代碼

注意：不要勾選“禁用模板默認CSS”

圖4 將處理后的css代碼復制到博客園頁面定制css代碼欄中

點擊保存之后你就可以新建一篇隨筆或文章并使用markdown編輯方式插入代碼，下面是我選擇的主題名稱為Atom One Dark Reasonable在cnblogs上的效果圖。

圖5 Atom One Dark Reasonable高亮主題在cnblogs上的效果圖

后續(xù)

到這里就已經(jīng)完成了自定義代碼風格的設(shè)置。可能你設(shè)置完成后發(fā)現(xiàn)和hightlight demo上看到的不太一樣，可能是代碼的字體，背景顏色等等略有差異。只要你懂一點CSS，自己微調(diào)一下所下載的CSS代碼中的相關(guān)屬性，直到自己滿意為止。我的代碼風格可以在我的其他文章中看到，感興趣的可以戳一戳我的其他博文~ ?(?>?

如果在配置過程中遇到什么問題，也歡迎私信我，或者郵件跟我說一下相關(guān)困難。

總結(jié)

以上是生活随笔為你收集整理的markdown mysql高亮_修改博客园markdown编辑器代码高亮风格的方法的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯，歡迎將生活随笔推薦給好友。