- 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 综合实例
16 Markdown 任务列表
1. 前言
To-do 任务列表是一种很常见的时间管理工具,它适用于工作计划、个人生活以及家庭学习。使用 Markdown 语法我们也可以实现一个基本的 To-do 任务列表。
Markdown 的 To-Do List 的内容是由无序列表,复选框,图标几种功能的组合。
环境说明:
考虑到 Markdown 工具之间的不兼容,有的内容直接从页面复制粘贴到本地不会正常显示,大家学习时自己动手写是肯定没问题的。本节所有实例代码及演示效果均使用 Typora 工具完成。
本节所有截图均为 Typora 导出 Html 后效果。
2. 语法详解
在 Markdown 文件中,在 " 无序列表 -,+,*
" 后面使用 「中括号 []」
声明复选框。在中括号中写入 x
,便可实现选中效果。
实例 1:
#### 复选框 checkbox
- [ ] Java
- [x] Php
或者
#### 复选框 checkbox
+ [ ] Java
+ [x] Php
或者
#### 复选框 checkbox
* [ ] Java
* [x] Php
这三种语法渲染后的结果相同,渲染结果如下:
其转换后的 html 的内容如下:
<ul>
<li class="task-list-item"><input type="checkbox" disabled=""> Java</li>
<li class="task-list-item"><input type="checkbox" disabled="" checked=""> Php</li>
</ul>
3. 使用场景及应用实例
To-Do List 可以用于工作计划、学习管理等。非常适合小型协作团队,用来制定任务计划、分配任务执行人、跟踪任务完成情况等。
实例 2:
做一个团队协作的任务列表。
第一步:规划任务、责任人
做一个学生管理系统为主题的课程设计,有四个主要参与者,小甲负责前端,小乙负责后端开发,小丙负责数据库,小丁测试和编写文档。因此整个任务也相应的分为了四个部分:前端、后端、数据库和统筹。
此时代码如下:
#### 学生管理系统
- [ ] 数据库设计 责任人: 小丙
- [ ] 服务端开发 责任人: 小乙
- [ ] 前端开发 责任人: 小甲
- [ ] 系统测试 责任人: 小丁
- [ ] 文档编写 责任人: 小丁
第二步:补充任务详情、完成时间
有了大致任务分工和责任人,此时需要每个责任人对自己的模块做补充,并预估完成时间。
这一步代码如下 (片段):
#### 学生管理系统(二)
- [ ] **数据库设计**
责任人:小丙
任务描述:搭建 Mysql 数据库环境;设计数据表;数据库设计满足三范式。
预计完成时间 5 天
第三步:责任人分解任务
将任务分解为一件件可完成的工作,并输出为任务列表。
这一步代码如下(片段)
#### 学生管理系统(三)
- [ ] **数据库设计**
责任人:小丙
任务描述:搭建 Mysql 数据库环境;设计数据表;数据库设计满足三范式。
预计完成时间 5 天
- [ ] 搭建数据库环境
- [ ] 整理数据表名、主要字段
- [ ] 设计 E-R 图
- [ ] 使数据表符合范式要求
- [ ] 应用到数据库中
- [ ] 整理此部分文档笔记
第四步:随时更新任务状态
根据进展情况更新任务的状态,即在中括号中用
x
替换 “空格”。这一步代码如下(片段)
#### 学生管理系统(四)
- [ ] **数据库设计**
责任人:小丙
任务描述:搭建 Mysql 数据库环境;设计数据表;数据库设计满足三范式。
预计完成时间 5 天
- [x] 搭建数据库环境
- [x] 整理数据表名、主要字段
- [x] 设计 E-R 图
- [x] 使数据表符合范式要求
- [ ] 应用到数据库中
- [ ] 整理此部分文档笔记
最后,我们可以看到完成的成果如下:
4. 小结
- 复选框只有跟在 “无序列表” 之后才能显示;
- 复选框语法
中括号 []
之间只能是空格
或者x
,其他情况下,不会渲染成复选框标签。
当我们用 Markdown 撰写自己的文档时,可以首先用 “任务列表” 的方式在文章的开头将整篇文章的写作安排写好,这样当我们写作篇幅较长时,这一习惯将会非常有利于思路的整理和延续。
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论