目錄

• 1、Markdown教程
• 2、生成html
• 3、目錄制作
• • 3.1 vscode Markdown Preview Enhanced 插件
  • 3.2 自定義側(cè)邊欄
• 4、參考

1、Markdown教程

Markdown 教程 | 菜鳥教程

2、生成html

通過 vscode 下載 Markdown Preview Enhanced、Markdown PDF等插件，就可以實現(xiàn)轉(zhuǎn)化

3、目錄制作

當(dāng)文檔內(nèi)容較多時，就想生成個目錄。而是不是頂部固定的目錄，是側(cè)邊欄固定的目錄。

3.1 vscode Markdown Preview Enhanced 插件

這款工具有生成側(cè)邊欄的功能，它在生成 html 時，也可以插入自定義 js。（這個功能挺強大的，可以改造成你想要的任何樣子）


安裝好后，打開 *.md 文件，會在右上角展示個圖標，點擊圖標，可以預(yù)覽 markdown 樣式。（兩個相同的圖標，左側(cè)是Markdown Preview Enhanced 插件，右側(cè)是 vscode 自帶的）

這個插件他有很多功能，這里不描述，只說如何生成側(cè)邊欄。

3.2 自定義側(cè)邊欄

在 *.md 文件中，插入這句話，

@import "https://haogeshuohuanihaohaoting.github.io/static/mdCreateMenu.js"

右鍵點擊預(yù)覽頁，會出現(xiàn) HTML -> HTML(offline)選項，點擊此選項，可以生成 html
這個html 會引入 https://haogeshuohuanihaohaoting.github.io/static/mdCreateMenu.js
這個 js 就是自定義的生成側(cè)邊欄的 js，這個功能較簡單，沒有折疊、拖拽的功能。（你們可以寫個自己喜歡的樣式）

4、參考

1、https://zhuanlan.zhihu.com/p/421829363

總結(jié)

以上是生活随笔為你收集整理的readme.md编写并生成html的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

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