VSCode+Markdown pdf及格式优化

背景

• 接触Jupyter notebook后，对markdown进行了些了解。
• 准备以后用来写笔记和开发文档。
• 开发文档需要转为pdf格式供人查看。

1. 效果展示

---

2. 软件及插件下载

• VSCode

• Markdown PDF

  • 安装VSCode后，打开并安装Markdown PDF插件。

    如下图:

    

  • 插件安装成功后，等待chromium自动安装。

    vscode界面右下角有提醒，如下图：

    

    已安装chrom浏览器，或下载失败，则可在配置中指定chrom.exe路径。

    方法为：更改”markdown-pdf.executablePath”配置项的值为chrom程序路径。

---

3. 自定义css文件，优化中文显示

因直接导出时，pdf格式并不够美观，特别是中文字体有很大问题，采用自定义css样式来美化。
需要把css文件路径写在”markdown-pdf.styles”配置中。

参考：

• 网上找到的一款比较漂亮的css格式文件，原地址请点击这里。并基于自身需求进行了一些修改。因本人对html和css都不熟悉，最后并没有达到想要的效果。

  • 重新设置了标题大小及字体

  • 更改部分颜色等

  最终css文件点击这里下载。

• 从这里试了些样式，最终使用markdown3进行了一些修改，包括字体、无序列表图标、分隔线、标题下划线。并加上了个人喜欢的分割线和下划线。

  修改下划线样式的时候费了番功夫，想把渐进效果的分割线用在标题下划线上，但自己改果然就是达不到效果= =最后搜到一种方法，加上自己尝试总算出来效果了。下次真不要费时间搞这个了，有这时间百度不如好好学学css…

  • 分割线参考这里

  • 渐变下划线参考这里

  最终使用的即这个版本，代码点击这里下载。

---

4. 编辑及导出

应该不用多说了吧- -