最後，我選擇了博客園

這是一個最帥的網站，也是一個最low的網站；

這是一個機智的網站，也是一個愚蠢的網站；

這是一篇記錄我爲何選擇了博客園並如何調♂教她的文章。看完這篇文章你能夠收穫什麼？你會不再想寫CSS！

前言

最近想找個地方整理一些本身的想法，研究了一些熱門站點，

CSDN

和大多數人同樣，CSDN是我從小白到入門最常逛的網站，兩年前曾在CSDN上持續記過100多篇的leetcode解題思路，堅持了大概1年吧。記得當時參加網易的筆試，考完後把算法題的解析往博客上一貼，幾個小時就達到了1w+的訪問量，這是第一次親身體驗什麼叫「蹭熱點」(笑)。後來因爲校招結束，算法題也就沒再刷了。如今再去看看本身的博客，看看CSDN，感受CSDN如今的廣告與抄襲仍是有點多...

掘金 && 思否

掘金是最近兩年火起來的網站吧，我的感受掘金的markdown編輯器是衆多博客網站中最好用的，文章排版也好看，掘金上最多的仍是前端開發相關。而思否做爲一個國內版的stackoverflow，像我這種面向stackoverflow編程的選手對它的好感度是直接拉滿啊，感受這兩個網站差很少，都做爲備選。

知乎

知乎上寫文章卻是中規中矩吧，專欄的訪問量與我當時在CSDN上訪問量增加速度差很少。最難受的一點就是，知乎的markdown編輯器太太太難用了！

自建網站

有人說你這麼挑乾脆本身搞一個網站吧，確實我有搞過，不信你能夠訪問下個人我的網站。部署過Hexo，感受發一篇文章太麻煩了，Gayhub Page訪問太慢。最後本身買了個阿里雲服務器，又在Gayhub上找個了開源的基於SpringBoot的博客系統tale，吭哧吭哧的就開搞了，雖然如今一直在服務器上跑着，訪問者寥寥無幾。

最後選擇了博客園。

還記得第一次打開博客園首頁的時候，這90年代的網站吧，這麼low，直接秒關。後來看一些博客的時候，嗯？這些博客好炫啊，怎麼都是cnblogs開頭的。

真香，自定義CSS天下第一。

綜合來講，博客園支持markdown(雖然每次我都是用神器typora寫好而後copy上去)，也願意被當成一個圖牀，SEO也還行，又是一個大牛雲集十分專業的網站，很是讚的一點就是，廣告竟然能夠直接經過自定義CSS給隱藏掉，我和個人小夥伴都驚呆了，博客園不會忽然有一天沒錢倒閉了吧？

雖然最後在好馬也吃回頭草的心理下選擇了博客園，可是調♂教是必不可少的(主要仍是改的多，怕忘記😄)。

主題選擇

在博客園後臺的設置->博客皮膚中能夠進行主題的選擇。

親，這裏推薦你這四款皮膚哦：

這幾款皮膚除了IMetro，都比較符合個人審美。可是我曾有幸見識過某位二次元大佬將IMetro這個主題改的「面目全非」，不過一時找不到它的站點了(逃)。

根據我的博客主題的不一樣，頁面定製的CSS代碼也不同。你們能夠直接搜索"博客園美化"，有不少超炫調教。

這裏呢我本身選擇了darkgreentrip。給你們看看對比圖：

左側公告欄(我不是給本身打廣告)

導航欄

目錄

引用

博客園默認的引用樣式很僵，直接採用大衆接受的這種風格：

代碼塊

採用sublime主題：

評論區

定製CSS

博客園的CSS定製功能其實就是你自定義一個同名樣式去頂掉當前博客使用的樣式。各個模板因爲樣式不一樣會有必定的區別，但整個html樹都是一致的。須要咱們會用F12去調試。

不得不說，博客園的這個CSS定製功能真是太棒了。

好比將博客園的引用改成通用markdown的引用效果，則在頁面定製CSS代碼中輸入：

.postBody blockquote{
  border: none;
  padding: 0 1em;
  color: #6a737d;
  border-left: 0.25em solid #dfe2e5;
  /*隱去默認的引號圖片*/
  background: none;    
  /*覆蓋默認90%*/
  width: 100%; 
}

經過border-left在左邊畫一條灰色的線便可。

代碼塊功能採用sublime樣式，這裏須要去highlight.js官網下載相關CSS樣式，國內訪問+下載比較慢。所以呢我把它放在gayhub上，打個廣告，你們須要獲取這個代碼塊樣式的能夠關注個人公衆號：Plus技術棧，回覆博客園獲取。

如圖，咱們只須要這個文件(固然其餘的風格你們能夠本身試試)。

咱們將裏面的樣式所有導入到博客園中，可是注意必定要在第一行的.hljs前面加上.cnblogs-markdown，否則樣式會失效。例如個人(也放在了gayhub上)：

最後，最最有意思的是，我經過修改廣告的CSS樣式，真的讓整個博客沒有廣告了。

這是正常的：

這是個人：

手動點個贊👍。

最後

其實整個頁面元素不少，包括頁首的漂浮着的github飄帶，頁腳的求關注等等樣式我還沒加，尤爲針對我這種青銅級別的CSS水平，整個修改花了巨長的時間，因此文末再次向各位讀者朋友求個關注(下次我再更新下超強編輯器VIM的魔改)。關注公衆號Plus技術棧，回覆博客園獲取整個頁面的樣式代碼。