讓你掘金博客中的代碼顯示得更酷

微信公衆號：顏家大少

本文所用排版工具：md.aclickall.com

有沒有以爲博客中的代碼塊顯示不夠酷，或排版沒個性?
能不能酷一點，或有個性一點？
那固然是能夠的！ ^-^

直接看代碼效果，先來個高調的

public class MyActivity extends AppCompatActivity {
@Override  //override the function
    protected void onCreate(@Nullable Bundle savedInstanceState) {
       super.onCreate(savedInstanceState);
       try {
            OkhttpManager.getInstance().setTrustrCertificates(getAssets().open("mycer.cer");
            OkHttpClient mOkhttpClient= OkhttpManager.getInstance().build();
        } catch (IOException e) {
            e.printStackTrace();
        }
}
複製代碼

再來個低調的

public class MyActivity extends AppCompatActivity {
@Override  //override the function
    protected void onCreate(@Nullable Bundle savedInstanceState) {
       super.onCreate(savedInstanceState);
       try {
            OkhttpManager.getInstance().setTrustrCertificates(getAssets().open("mycer.cer");
            OkHttpClient mOkhttpClient= OkhttpManager.getInstance().build();
        } catch (IOException e) {
            e.printStackTrace();
        }
}
複製代碼

幾十種風格，任你選擇

固然，各類語言也不在話下

css的：

p {
  margin: 1.5em 0px;
}
h1,h2,h3,h4,h5,h6 {
  margin: 1.5em 0px;
  font-weight:bold;
}
複製代碼

html的：

<div >
      <span>abc<input id="code" type="checkbox" name="code" ></input></span>
       <textarea id="editor" rows="100" cols="100"></textarea>
</div>  
複製代碼

支持任意的語言，並能自動識別，有須要時也可直接指定

還有更牛的地方是，若是你對上面的風格都不滿意時，你甚至能夠自定義本身的代碼高亮的樣式，請參考："一鍵排版"中的"代碼塊樣式「

看了後，你是否是很好奇，這是怎樣實現的？

其實簡單的很

1. 打開免費的markdown轉換工具：md.aclickall.com，並把你的markdown內容拷貝過去
2. 選擇你喜歡的代碼風格
3. 選擇"一鍵排版"中的"任意樣式"對你的內容進行排版
   你甚至能夠任意修改此樣式並保存。
   注意：你可能會發現行間距很窄，但這個是沒問題的，複製到掘金後，掘金會自動調整
   參考圖以下：
   
4. 預覽OK後，選擇複製
5. 把前面複製的內容粘貼到掘金默認的markdown編輯模式左邊的編輯框，就搞掂

更多內容，歡迎關注微信公衆號「顏家大少」