今天跟了一下 winter 老师的课程，学了下语义化。
在我们的日常工作开发中，用的最多的就是 div 还有 span，可能其他用的稍微多一点的也就还有 p 标签，ul标签， li 标签。其实在日常工作开发中，用vue、react 框架的时候，基本上 div 标签 和 span 标签就能够满足我们的需求了。
然后我去翻了翻腾讯、淘宝、网易的主页，甚至是老师用来展现例子的 wikipedia。我发现，这些国内主流网站，也没有对 HTML 语义化用的特别极致。但是有一点，就是这些网站的 html 的 class 属性写的都非常的简洁明了，让人一眼看过去就知道写了些什么。
如果要写出一个完美的符合 HTML 语义化的网页，说句实话，真的要下很大的功夫。
对于 HTML语义化，总结下来就是，用比不用好，不用比用错好。
别瞎用！！！大不了就不用
对，要是你实在是拿不准的时候，反而不如来个 div 加个简洁明了的 class 好。
不过既然都到了这里，那么就总结一下 HTML 的语义标签吧。
来，看这里。
| Tag | Description |
|---|---|
| header | 通常出现在前部，表示导航或者介绍性的内容。 |
| nav | 导航链接的部分。 |
| aside | 表示跟文章主体不那么相关的部分，它可能包含导航、广告等工具性质的内容。 |
| article | 它表示具有一定独立性质的文章。 |
| main | 整个页面只出现一个，表示页面的主要内容，可以理解成特殊的 div。 |
| section | 一个文档或应用程序的通用部分。 |
| time | 时间 |
| address | 表示“文章（作者）的联系方式”，address 明确地只关联到 article 和 body。 |
| footer | 通常出现在尾部，包含一些作者信息、相关链接、版权信息等。 |
| figure | 这个就是用来展示图片下面环绕文字的标签 |
| figcaption | 用来存放图片下面的文字 |
| dfn | 用来包裹定义, define terms |
| cite | 存放引用 |
顺便来看看 dl dd dt
这个以前是真的没有接触过(见都没见过)
<dl>
<dt></dt>><!--defination term-->
<dd></dd><!--defination description-->
</dl>
dl 就是 dfn 的一个列表形态。
dt 用来区分标题，里面的内容为所要阐明的术语
dd 就用来对 dt 里面的 term 进行进一步的补充说明。
真的要搞语义话，那就去看看 markdown 里面能够生成的 html 里有哪些标签。研究那些能用的标签就够了。