在VSCode中用Markdown自動(dòng)生成PPT詳細(xì)使用指南，支持多種風(fēng)格和排版，支持ppt轉(zhuǎn)為pdf等。

Visual Studio Code跨平臺(tái)代碼編輯器 v1.100.2 64位 官方中文安裝版

• 類型：編譯工具
• 大?。?/span>102MB
• 語(yǔ)言：簡(jiǎn)體中文
• 時(shí)間：2025-05-16

查看詳情

Marp 官網(wǎng)：

https://marp.app/

這款軟件也能在 Windows 或 Linux 系統(tǒng)上使用，并不局限于 macOS 系統(tǒng)。

今天要介紹的是 Marp 推出的 VS Code 插件——Marp for VS Code，在 VS Code 安裝了這個(gè)插件后，意味著我們也可用 VS Code 來(lái)制作幻燈片了。

Markdown簡(jiǎn)潔易用，尤其可以高效的編輯數(shù)學(xué)公式，而基于Markdown的兩個(gè)VSCode插件正是今天的主角——Marp和MPE。對(duì)于制作簡(jiǎn)潔的數(shù)學(xué)類PPT來(lái)說(shuō)，Marp和MPE似乎是最合適的選擇，畢竟該類PPT不需要花里胡哨的效果，更應(yīng)該專注于內(nèi)容。

Marp雖是一個(gè)開源的桌面軟件，但可通過(guò)VSCode加Marp插件的方式使用，完全能高效地制作輕量的幻燈片。下載安裝VSCode后，在其插件欄搜索“Marp for VS Code”，點(diǎn)擊安裝。

安裝了 Marp for VS Code 插件后，不需要任何配置，就能直接做 PPT。

點(diǎn)擊 VS Code「文件」選項(xiàng)卡，選擇「新建文件」，在彈出的面板，文件類型選擇 Marp Markdown。

選擇 Marp Markdown 文件后，會(huì)新建一個(gè)下圖的文件，開頭有一個(gè)配置選項(xiàng) marp: true，表示使用 Marp 來(lái)創(chuàng)建 PPT。

點(diǎn)擊文件右上角的「預(yù)覽」按鈕，就可以在右側(cè)看到第一個(gè)幻燈片頁(yè)面。

上面空空如也，接下來(lái)就輪到我們用 Markdown 語(yǔ)法大展身手了：

ppt制作過(guò)程

對(duì)于熟悉 Markdown 的朋友不用多說(shuō)，就像是寫文章一樣來(lái)寫 PPT。

如果想要?jiǎng)?chuàng)建第二個(gè)頁(yè)面，只要在末尾添加 3 個(gè)短橫線 -，下方就會(huì)多出一張新的幻燈片。

不過(guò)，如果我們想要在幻燈片中插入圖片，就會(huì)略微麻煩一些。

直接插入的本地圖片，渲染后會(huì)顯示為丟失，解決的方法是先將本地圖片上傳到網(wǎng)上（圖床），再粘貼圖片鏈接，圖片才能正常顯示。

插入的圖片會(huì)顯示為原始的大小，如果圖片比較大，會(huì)占據(jù)整個(gè)幻燈片頁(yè)面，影響其他內(nèi)容的展示。

要想解決這個(gè)問(wèn)題，只需要在 Markdown 圖片名稱的位置，配置一下圖片的寬度或高度：

w:300 h:300

這里的 w 和 h 分別是 width 和 height 的縮寫，注意 w 和 h 必須是小寫。

更改全局主題

Marp 渲染得到的幻燈片默認(rèn)為白底藍(lán)/黑字，如果你不喜歡默認(rèn)的樣式，可以在 Markdown 文件的開頭，更改 theme 字段的值，來(lái)更改幻燈片的全局主題。

theme 字段有 3 個(gè)值：

default（默認(rèn)值，可省略）

uncover

gaia

下圖是 uncover 主題的效果，所有內(nèi)容都居中顯示，引用內(nèi)容的樣式從豎線變?yōu)殡p引號(hào)。

下圖是 gaia 主題的效果，白色背景更改為淺黃色，有點(diǎn)像一些閱讀類 App 的暖光/護(hù)眼模式，但我不確定這種顏色是否真的護(hù)眼。

如果想用 gaia 主題淺黃色的背景，但又想像 uncover 主題那樣，讓內(nèi)容居中顯示，只要在文件開頭的配置中，再添加一個(gè) class 字段，值設(shè)置為 lead 即可。

不過(guò)最終的效果還是有一點(diǎn)差別，添加了引用和無(wú)序列表樣式的內(nèi)容，還是會(huì)保持原來(lái)的靠左顯示。

更換單個(gè)幻燈片的背景和文字顏色

前面設(shè)置的主題，屬于全局樣式，會(huì)影響到所有幻燈片的背景顏色。

如果我們想自定義其中一個(gè)或多個(gè)頁(yè)面的顏色，也是可以做到的。

在想要更改幻燈片背景色的頁(yè)面開頭，加上 字段，就可以更改頁(yè)面的背景色。

這里的顏色可以是顏色的英文，例如上面的藍(lán)色 blue，也可以是 rgb 值，這有點(diǎn)像是在寫 CSS 樣式了。

更換背景色之后，如果新的背景色與文本內(nèi)容的顏色區(qū)分不明顯，就會(huì)影響到文本內(nèi)容的正常觀看，這時(shí)就需要更改文字的顏色啦。

更改文本內(nèi)容的顏色，需要在下面多配置一個(gè)選項(xiàng) ，就能自定義文本的顏色。

既然可以修改單張幻燈片的背景色，那有些人可能就會(huì)想到：可不可以更改所有幻燈片的背景色呢？

也是可以的～只要在文件開頭新增一個(gè)選項(xiàng) backgroundColor，就能自定義所有幻燈片的背景色。

當(dāng)然，頁(yè)面單獨(dú)設(shè)置的背景色會(huì)覆蓋掉全局設(shè)置的顏色，正如你在下圖看到的，即便我們將全局的背景色更改為黃色，第二頁(yè)還是維持了單獨(dú)設(shè)置的藍(lán)色。

將幻燈片導(dǎo)出為 PDF

最后，無(wú)論用 Marp 和 VS Code 來(lái)寫 PPT 有多么好，最終還是要落回到地面，思考一個(gè)問(wèn)題：如何把你做好的 PPT 分享給其他人？如何讓你兼容更多的人或場(chǎng)景呢？

還好 Marp 也為我們考慮到了，支持將渲染得到的 PPT 導(dǎo)出為 PDF 文件。

方法如下：

點(diǎn)擊 Marp Markdown 文件右上角的 Marp 圖標(biāo)（三角形圖標(biāo)），在彈出的面板，選擇「Export Slide Deck」，就可以將 PPT 導(dǎo)出為 PDF 啦～

注意事項(xiàng)

如果你的 VS Code 安裝了 Markdown 渲染插件 Markdown Preview Enhanced，需要先將這個(gè)插件「禁用」或是「卸載」，轉(zhuǎn)而使用 VS Code 后來(lái)集成的 Markdown 預(yù)覽功能，才能正?？吹戒秩竞蟮?PPT 頁(yè)面。

相關(guān)推薦：

vscode有哪些好用的插件 12個(gè)不容錯(cuò)過(guò)的VSCode插件

VSCode怎么用? 史上超全vscode配置使用教程

VScode無(wú)法顯示跳轉(zhuǎn)到定義怎么解決? vscode無(wú)法跳轉(zhuǎn)定義的原因及解決方法

最新評(píng)論