在 FirstWeb.app 中有对应的一个 Markdown 样式 Demo 的网站目录，可以参考其源码。
Markdown 是一种简单的写作语法，可以在保证极佳的写作体验的同时，获得高效率；如果没有使用过 Markdown 的，自行了解，非常推荐使用。
本课程是在 MarkEditor 上写作并导出的，同样使用 Markdown 语法，MarkEditor 是付费软件，与 MarkEditor 源自同一引擎的 MarkDown.app 则是免费的。
目前同样免费的还有 Typora，它是所见所得的模式，相对于新手而言更友好；而我的个人偏好，并不推荐『所见所得』模式。
Markdown 专注于文本，放弃对格式的控制。而文本最终呈现，仍然是需要格式的，所以 Markdown 对一些必要的格式(比如几级标题、加粗、引用、列表)进行标注，比如 # 一级标题、## 二级标题。
那么，Markdown 最终又如何呈现出对应格式呢？ Markdown 的文本会转为 HTML 格式，比如 # 一级标题 会变成 <h1>一级标题</h1>，然后，通过 CSS 样式来控制视觉。这种机制完美地分离了两者，内容的归内容，视觉的归视觉。
我们针对 Markdown ，完成一个渲染其样式的简单页面。
源码内容主要是 FirstWeb 中的 Demo，你可以直接在上面的代码中修改，主要是 markdown.css。
Markdown 解析成 HTML 后，里面涉及了常用的一些 DOM 元素，可以在修改 markdown.css 过程中，对这些 DOM 元素做更进一步的了解。
另外的 page.css 主要是页面的样式，本身也比较简单，具体的自己看详细的代码就可以了；markdown_extra.css 是一些额外形式的样式，比如代码高亮，可以直接略过。
一般来说，Markdown 解析为 HTML 的时候，段落、行是使用 P + BR(换行)来实现，这样对于排版并不友好，我们的 Markdown 解析引擎是将其转为 P+SPAN+BR 来实现，可兼容常见的形态，又对中文排版更友好。
问题来了，为什么 P+SPAN+BR 的结构能兼容 P + BR，但又能做到 P + BR 做不到的呢？此处并不陈述答案，自己想想，应该容易理解或者找到一个答案。
或者再给一个提示: 行首缩进。在 page.css 中可以找到代码上的对应(默认处于注释的状态)，此时P + BR可否实现？
按照自己的需求，可以有如下三种使用方式 (任选其一):
markdown.css & page.css，替换掉少量的基本样式，比如背景、文字颜色、H1-H6 的颜色、blockquote 的左边框色、链接颜色，以形成一个新的风格；
markdown.css， 进一步对不同 Markdown 解析后的 DOM 元素进行样式的再定义。
markdown.css & page.css 中，现实世界中，并非所有 CSS 规则都规规矩矩呆一个地方的，不过分的割裂，都是正常的。
实心圆、空心圆的样式可否调整，能否使用 :before 来实现？又或者仅仅让这 圆点 跟文字的颜色不一样，如何处理呢？ (<li><span>文字</span></li>这种形式，可以试试让 li 是圆点的颜色，然后 span 是文字的颜色，就实现这个效果了)
如果此时内心犹疑，担心完全自定义全新的样式，根本做不到。
这没有关系，有担心，很正常；真的做不到，也很正常。
但是，我们可以“抄”呀。如果看到他人网页中自己满意的视觉风格 (Markdown 的样式应该还是蛮多的)，就可以“抄”了，但不要直接去抄代码，用自己的代码实现，如果不理解的，就 Debug 源头的页面，看它样式为什么这么写。
有思考的去“抄”，是临摹，是高效率的学习方法之一；如果不思考的话，倒就真的成了抄袭，在自学的过程中，抄袭是自我毁灭的不二之选。而临摹和抄袭的边界，自己把握，这个度，过高和过低，都不是太好的事情。
小贴士: 如何获得 Markdown 解析后的 HTML 源码呢？ 可以使用 MarkEditor 或者 Markdown.app 将其导出为 HTML 文件，然后用任意的编辑器打开它，或者使用浏览器打开右键查看源码。