Marp 入门与教程:让你一分钟爱上代码写PPT的乐趣

简介: Marp 是一个基于 Markdown 的开源幻灯片制作工具,可将 Markdown 文档轻松转换为精美幻灯片。支持 VS Code 插件实时预览、命令行工具批量处理、自定义主题等,适用于技术分享、工作汇报和教学等多种场景。相比 LaTeX Beamer,Marp 学习成本低,跨平台支持好,设计现代美观。

Marp 入门与教程

一、什么是 Marp?

Marp 是一个基于 Markdown 的开源幻灯片制作工具,可以轻松将 Markdown 文档转换为精美的幻灯片。其核心是 Marpit 框架,支持可定制主题、多种输出格式和动态功能。

与 LaTeX 的 Beamer 比较:

对比项 Marp LaTeX (Beamer)
易用性 使用 Markdown 语法,易学易用 基于 TeX,语法复杂,学习曲线陡峭
功能扩展性 - 支持 CSS 定制
- 支持图片背景
- 支持 Mermaid 图表
- 支持自动布局和响应式设计
- 强大的数学公式支持
- 适合编写专业文档
- 高级的排版控制
输出支持 HTML、PDF、PPTX PDF
实时预览 可通过 VS Code 插件快速预览 缺乏直观的实时预览
适用场景 快速演示文稿、轻量级幻灯片 高端学术演示或复杂幻灯片

总结:Marp 更适合需要快速生成现代化演示文稿的用户,而 LaTeX Beamer 更适合专业的学术排版。


二、Marp 支持的功能

  1. 通过插件快速制作:支持 VS Code 插件和实时预览。
  2. **命令行工具 (CLI)**:批量处理,导出 HTML、PDF 等格式。
  3. 支持 YAML 配置:灵活设置幻灯片主题、尺寸和分页。
  4. 自定义样式:支持 CSS 修改主题和排版样式。
  5. 嵌入动态内容:如代码高亮、公式 (MathJax)、图片背景等。
  6. 多种主题支持:内置主题(default、gaia、uncover)和自定义扩展主题。

三、功能介绍与入门教程

1. 使用 VS Code 插件

功能简介

  • 提供实时预览功能。
  • 可一键导出 PDF。
  • 支持 Markdown 语法高亮。

入门教程

  1. 安装 VS Code 和插件
  • 下载并安装 VS Code
  • 在扩展商店搜索并安装 Marp for VS Code 插件。

  1. 新建 Markdown 文件
    创建一个 .md 文件,并在文件开头加入以下 YAML 配置:

---
marp: true
theme: uncover
size: 16:9
paginate: true
backgroundColor: #f0f0f0
---


  1. 实时预览
    点击下图 Marp 图标,即可看到实时幻灯片预览。

  1. 导出 PPT
    点击下图图标,选择Export……,最后在保存类型处点击下拉框选择要保存的文件类型


2. 使用 CLI 工具

功能简介

  • 支持批量生成和自动化处理。
  • 输出 HTML、PDF 等格式。

入门教程

  1. 安装 CLI 工具
  • 安装 Node.js 环境。
  • 执行以下命令安装 Marp CLI:

npm install -g @marp-team/marp-cli

  1. 创建 Markdown 幻灯片
    示例内容如下:

---
marp: true
theme: gaia
size: 4:3
---

# 欢迎使用 Marp
- 简单
- 快速
- 美观

  1. 导出为 PDF 或 HTML
  • 导出 PDF:

marp slide.md -o slide.pdf

  • 实时预览:

marp slide.md --preview


3. 自定义主题

功能简介

通过 CSS 修改样式,满足品牌化或个性化需求。

入门教程

  1. 创建主题 CSS 文件

@import 'https://fonts.googleapis.com/css?family=Roboto';

section {
   font-family: 'Roboto', sans-serif;
   background-color: #ffffff;
   color: #333333;
}

h1 {
   font-size: 2.5em;
   color: #ff5733;
}

  1. 引用自定义主题
    在 Markdown 文件中添加:

---
marp: true
theme: custom
---

  1. 应用主题
    使用 CLI 或插件预览效果。

四、Marp 的优势与应用案例

  1. 快速上手
  • 对比 LaTeX Beamer,不需要复杂的语法和环境配置,学习成本低。
  • YAML 配置简单明了。
  1. 跨平台支持
  • 支持在不同系统(Windows、macOS、Linux)下运行,且兼容多种编辑器。
  1. 现代化设计
  • 内置主题时尚美观,支持动态背景和交互内容。
  1. 适用场景丰富
  • 技术分享:嵌入代码片段、公式等内容。
  • 工作汇报:快速制作专业化演示文稿。
  • 教学场景:Markdown 文本轻松生成幻灯片。

应用案例:

  • 技术分享:通过 VS Code 插件,工程师可以快速构建内含代码高亮的技术演示。
  • 团队培训:CLI 批量生成幻灯片,满足大规模培训需求。
  • 个人总结:写笔记的同时生成高质量幻灯片,一举两得。

五、学习参考链接

  1. Marp 官方网站
  2. Marp VS Code 插件
  3. Marpit Markdown 文档
  4. 少数派 Marp 教程
  5. Marp GitHub 仓库

按以上步骤学习后,相信你能快速掌握 Marp,并将其高效应用于日常工作和学习中。

目录
相关文章
|
6月前
|
Rust 算法 JavaScript
编程入行指南:从代码小白到技术大牛的“码农”奇幻漂流
编程入行指南:从代码小白到技术大牛的“码农”奇幻漂流
|
3月前
|
算法 开发者 Python
探索代码之美:从小白到大师的编程旅程
【9月更文挑战第15天】本文将带领读者走进编程的世界,从最初的困惑与挫败,到逐步掌握编程技能并发现其乐趣。我们将通过具体案例和代码示例,展示如何从基础语法学习,到解决实际问题,再到优化代码的过程。这不仅是技术上的提升,更是一个思维和解决问题能力成长的故事。无论你是编程新手还是有一定经验的开发者,这篇文章都将为你提供有价值的见解和启发。
|
3月前
|
存储 算法 安全
探索代码世界的奇幻之旅
在数字时代的浪潮下,编程技术如同一座神秘的宝库,吸引着无数探险者前来探秘。本文将通过一次虚拟的编程探险旅程,揭示编程技术的奥秘和魅力,带领读者领略代码构建的奇幻世界。
41 8
|
3月前
|
人工智能 自动驾驶 数据挖掘
探索代码之美:从小白到大牛的编程之旅
【9月更文挑战第4天】编程,一种将思维转化为现实的神奇艺术。本文将以通俗易懂的方式,带领读者走进编程的世界,从基础概念到实际案例,逐步揭示编程的魅力和挑战。无论你是编程新手,还是有一定经验的开发者,都能在这篇文章中找到属于自己的启示和成长路径。让我们一起开启这场探索代码之美的旅程吧!
42 5
|
4月前
|
算法 数据挖掘 开发者
探索编程之美:从小白到大牛的代码之旅从零到一:我的Python编程之旅
【8月更文挑战第30天】在数字世界的编织中,代码是构成一切的基石。本文将带领读者踏上一段代码探索之旅,从最初的迷茫与困惑,到逐渐找到方向,再到深入理解编程的本质和美学。通过个人的技术感悟和成长历程,我们将一同见证如何通过持续学习、实践和创新,在编程的道路上越走越远。
|
7月前
|
人工智能 分布式计算 Java
【C++入门:C++世界的奇幻之旅】(上)
【C++入门:C++世界的奇幻之旅】
117 1
|
7月前
|
存储 安全 编译器
【C++入门:C++世界的奇幻之旅】(下)
【C++入门:C++世界的奇幻之旅】
|
7月前
|
编译器 Linux C语言
【C++入门:C++世界的奇幻之旅】(中)
【C++入门:C++世界的奇幻之旅】
|
缓存 Dart JavaScript
编程时光小册上新啦
持续推出 《linwu的算法笔记》,《现代Javascrip高级教程》,《现代TypeScript高级教程》,《深入浅出Dart》等等精品小册
417 0
编程时光小册上新啦
|
JavaScript 前端开发 Java
【程序员小白入门】这几个宝藏菜鸟教程网站记得收藏!!!
其实菜鸟教程相关的网站内容都大同小异,推荐这几个原因是页面交互比较简单,重要的是没有任何广告。

热门文章

最新文章