VS Code在編輯.md文件的時候，可以通過快捷鍵 Ctrl+Shift+V來預覽最終的顯示效果。

vscode_markdown_preview.png

從圖片中的效果我們可以看到，使用者設定中自定義的字型樣式和字型大小在預覽中完全不起作用。

其實在官方的配置檔案中給出了使用者自定義Markdown預覽效果的CSS設定路徑。

    //-------- Markdown preview configuration --------

    // A list of URLs or local paths to CSS style sheets to use from the markdown preview.
    "markdown.styles": [],
 

我們可以通過這樣：

"markdown.styles": [ "file:///D:/user.css" ] 

或者這樣：

 "markdown.styles": [ "https://jasonm23.github.io/markdown-css-themes/foghorn.css" ]

來引用第三方的CSS檔案。

一些網站也都有提供各種樣式的Markdown CSS，例如：https://jasonm23.github.io/markdown-css-themes

我嘗試了一下，效果是這樣的：

Paste_Image.png

可以看到，有些CSS雖然美觀但是不能適用主題的Theme。

其實對於預設的Preview CSS，唯一看不慣的就是字型。那我們只需要簡單的修改下字型就OK了。

於是，我們可以在路徑:
d:\Program Files (x86)\Microsoft VS Code\resources\app\out\vs\languages\markdown\common\markdown.css
下修改markdown.css 檔案，重新整理效果就出來了。

我只是嘗試修改了：字型 font-family和行間距 line-height，效果如下：

Paste_Image.png

作者：任前程
連結：https://www.jianshu.com/p/590b06d25d53
來源：簡書
簡書著作權歸作者所有，任何形式的轉載都請聯絡作者獲得授權並註明出處。