vscode md插件安裝
### Markdown Preview Enhanced
具體的使用可以查看官網文檔。
https://shd101wyy.github.io/markdown-preview-enhanced/#/zh-cn/customize-css
- 插件安裝完成后 右上角圖表可以設置側邊展示,或者側邊單獨的展示區域(不受vscode 主體背景色影響)
### 樣式自定義
打開命令面版 輸入如下
Markdown Preview Enhanced: Customize Css
編輯自己的樣式--我直接找的其它人的css
.markdown-preview.markdown-preview { // 在這里編寫你的樣式 // 例如: // color: blue; // 改變字體顏色 // font-size: 14px; // 改變字體大小 // 自定義 pdf 導出樣式 @media print { }
// 自定義 prince pdf 導出樣式
&.prince {
}
// 自定義 presentation 樣式
.reveal .slides {
// 修改所有幻燈片
}
// 自定義 presentation 樣式
.slides > section:nth-child(1) {
// 修改 第 1 個幻燈片
}
}
.md-sidebar-toc.md-sidebar-toc {
// 邊欄目錄樣式
}
css 樣式地址:選擇你中意的 http://md.aclickall.com/
直接 復制到你的 style.less 中保存就OK了。然后你就可以看到效果了

直接引用本地樣式 -我沒用過
Markdown Preview Enhanced 允許你對於不同的 markdown 文件定義不同的樣式。 你可以在 front-matter 設置 markdown 文檔的 id 和 class。 你可以在你的 markdown 文件中非常簡單地 引用 less 或者 css 文件。
---
id: "my-id"
class: "my-class1 my-class2"
---
@import "my-style.less"
# Heading1
my-style.less 如下:
#my-id {
background-color: #222;
color: #fff;
h1,
h2,
h3,
h4,
h5,
h6 {
color: #fff;
}
}