- 01 Markdown 简介
- 02 Markdown 导出 HTML
- 03 Markdown 分级标题
- 04 Markdown 段落
- 05 Markdown 分割线
- 06 Markdown 列表
- 07 Markdown 引用
- 08 Markdown 强调
- 09 Markdown 辅助线
- 10 Markdown 字体字号
- 11 Markdown 前景色、背景色
- 12 Markdown 行内代码
- 13 Markdown 代码块
- 14 Markdown 超链接
- 15 Markdown 图片
- 16 Markdown 任务列表
- 17 Markdown 特殊符号
- 18 Markdown 代码高亮
- 19 Markdown 注释
- 20 Markdown 表格
- 21 Markdown 流程图
- 22 Markdown 时序图
- 23 Markdown 类图
- 24 Markdown 状态图
- 25 Markdown 甘特图
- 26 Markdown 饼图
- 27 Markdown 上标、下标
- 28 Markdown 数学公式
- 29 Markdown 脚注尾注
- 30 Markdown 生成目录
- 31 Markdown 综合实例
文章来源于网络收集而来,版权归原创者所有,如有侵权请及时联系!
30 Markdown 生成目录
1. 前言
目录是文章内容的整体索引,是文章结构的最直观表现形式。
Markdown 为生成目录提供了快捷方式,大大降低了文章目录的编排复杂度。
环境说明:
考虑到 Markdown 工具之间的不兼容,有的内容直接从页面复制粘贴到本地不会正常显示,大家学习时自己动手写是肯定没问题的。本节所有实例代码及演示效果均使用 Typora 工具完成。
「TOC」是 Markdown 扩展语法,Typora 默认已支持该扩展。
2. 语法详解
2.1 目录的自动生成
在 Markdown 中,自动生成目录非常简单,只需要在恰当的位置添加 [TOC]
符号,凡是以 #
定义的标题都会被编排到目录中。
实例 1:
使用 [TOC]
生成文档目录导航。
[TOC]
# 一级标题
一些内容。。。。
## 二级标题
一些内容。。。。
### 三级标题
一些内容。。。。
渲染效果如下:
其 Html 内容如下:
<div class="md-toc" mdtype="toc">
<p class="md-toc-content" role="list">
<span role="listitem" class="md-toc-item md-toc-h1" data-ref="n2">
<a class="md-toc-inner" href="#一级标题">一级标题</a>
</span>
<span role="listitem" class="md-toc-item md-toc-h2" data-ref="n3">
<a class="md-toc-inner" href="#二级标题">二级标题</a>
</span>
<span role="listitem" class="md-toc-item md-toc-h3" data-ref="n4">
<a class="md-toc-inner" href="#三级标题">三级标题</a>
</span>
</p>
</div>
2.2 手动书写目录
尽管自动生成目录非常方便,我们也难免有自定义目录的需求,如只显示一二级大标题等。
手动添加目录的方法就是将「列表」和「页内超链接」相结合。
实例 2:
用列表和链接做出目录效果。
- [一级标题](#一级标题)
- [标题 1-1](#二级标题 1-1)
- [标题 1-2](#二级标题 1-2)
- [二级标题](#二级标题)
- [标题 2-1](#二级标题 2-1)
- [标题 2-2](#二级标题 2-2)
- [一级标题](#一级标题)
- [标题 1-1](#二级标题 1-1)
- [标题 1-2](#二级标题 1-2)
- [二级标题](#二级标题)
- [标题 2-1](#二级标题 2-1)
- [标题 2-2](#二级标题 2-2)
# 一级标题
一些内容……
## 二级标题 1-1
一些内容……
## 二级标题 1-2
一些内容……
# 二级标题
一些内容……
## 二级标题 2-1
一些内容……
## 二级标题 2-2
一些内容……
其渲染效果如下:
3. 使用场景
目录适用于有章节标题的文章,通常用于跳转,所以适合在网页或 PDF 文件中使用。
4. 小结
- Markdown 支持自动使用
[toc]
标记生成目录; - 当自动生成的目录无法满足需求时,我们仍可通过「页内超链接」的形式定义目录;
- 由于 Markdown 没有分页的概念,所以目录中无法自动页码。
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论