这一段时间，为了准备面试，好好的重读了一次html，发现了一些以前没有关注过的小细节。

html这种半个小时就可以上手的东西，大部分人可能止步于一些很基本的标签，比如h系列，p，div，a，img这一类，今天来说说一些比较有意思的html内容吧。

那些很“厉害”的语义化标签

  • article ：就是文章
  • aside：姑且当是边栏吧
  • header：头部
  • footer：脚部……
  • nav：导航条

以上的这些标签都是页面布局中常用的标签，但是实际上你还是需要给他们放到合适的位置，并加上合理的css以保证他们出现在正确的位置。

  • ul：无序列表
  • ol：有序列表
  • li：列表项

其实现在ul的用途更广一些……比如nav中的链接就应该写在ul中，这样比较美观易读一些。

  • dl：定义列表
  • dt：定义列表中的项目
  • dd：定义列表中的内容

我感觉这个用的也不太多，因为比如一个dl中有几个dt，其实也可写成几个ul，但是出于语义化的思路，把有关系的列表就可以这么写。

  • pre：将源内容展示出来，但中间不能包括块级元素。
  • code：专门处理源代码，可以被浏览器特殊处理。
  • var：指pre，code中的变量，表示效果就是斜体啦。
  • dfn：定义的文字用这个标签，表示效果依旧是斜体。
  • samp：用来做样本的文本，无特殊效果。
  • kdb：键盘文字，比如可以写 kbd esc /kbd 就表示esc这个键的意思。

这里列了一些用来语义化处理文字的标签，常见的还有del之类的就不提了。

一些实用好标签！

  • wbr：被这个标签影响的内容在页面宽度不足是会折行，类似overflow，很神奇的，类似的标签​或­ 他们之间仅仅有一些兼容性差异。
  • rel：这个html属性可以放一些没有指定的参数，而且所有的标签都有。
  • acronym：这个标签可以用来给文字加一个解释。
  • base：给每个页面加一个基本url。这个模板处理估计比较好用。
  • sub sup：下标和上标，公式输入就靠他们了！