html语义（一）
1.无序列表ul>li
从字面意思去理解，既然是“无序”的，就说明列表项中的信息重要性是一致的。
比较常见的是门户站点的新闻列表。
2.与无序列表对应的列表是有序列表，ol>li
有序列表排名分先后顺序的。常见的是各种排行榜，比如music排行榜。
3.定义列表dl>dt+dd
定义列表看着好理解，但是容易被滥用。一个标题dt，然后dd对此进行展开描述。
详见链接：http://bbs.blueidea.com/forum.php?mod=viewthread&tid=3030640
4.表格 table,caption,thead,tbody,tfoot,tr,td
表格标签没什么好说的，参照:http://www.w3school.com.cn/html/html_tables.asp
对于表格和列表，需要说明下两者之间的差异。因为css的强大无所不在，所以，使用列表也可以模拟表格效果。
但模拟终归模拟，从语义的角度来看，提供一个良构才是正确的开端。
那么，表格和列表的差异在哪里？
很简单：表格是用来产生数据列，而列表只是用来产生数据级。
都两列以上了，你还使用列表，脑门儿让门夹了么？
来看看一些比较二的页面，脑子绝对让门儿夹了：
http://www.9sky.com/top/，歌曲排行都是无序列表啊，都三列了。
5.h标题的使用
这绝对是个有意思的话题。因为有一个普遍的观点，从SEO的角度去考虑，一个页面只能有一个H1。
新手在网上看这类东西绝对是坑爹啊。
那么，如何正确使用h1,h2,h3,h4,h5,h6呢？
有没有想过，为毛没有h7呢？
好，我们先看看一般的正确使用h标题的示例，代码如下：
<div class="music_mod"> <h1>音乐</h1> <div> <h2>音乐分类</h2> </div> <p>内容</p> </div> <div class="junshi_mod"> <h1>军事</h1> <p>内容</p> </div> <div class="entertainment_mod"> <h1>娱乐</h1> <div> <h2>音乐分类</h2> <ul> <li> <h3>流行</h3> <p>流行前线</p> </li> <li> <h3>古典</h3> <p>古典曲目</p> </li> </ul> </div> <p>内容</p> </div>
同级使用同级标题，音乐，军事，娱乐模块属于同一级别，故这三个模块内部的标题是从h1开始的。
而在模块的内部，比如娱乐部分，h1和div属于同级，但是div内部的标题就和h1不属于同级了，所以只能用h2。同理，ul中的h只能用h3。
这是正常的人对标题的理解。毛病也不大，但是思考不够深入。我们再扩展下思路，让这样的语义结构崩溃掉。
假如，对于音乐模块，我还需要这么做：
<div class="music_mod"> <h1>音乐顶级</h1> <div> <h1>音乐</h1> <div> <h2>音乐分类</h2> </div> <p>内容</p> </div> </div>
我又想在
<div> <h1>音乐</h1> <div> <h2>音乐分类</h2> </div> <p>内容</p> </div>
外套一层，怎么办？h1都用啦，岂不是要哭啦？
当然举例不太恰当，但并不排除有此可能。比如树状图。
解决这样的问题很简单，就是标题不分级别，全部使用h1。
<div class="music_mod"> <h1>音乐</h1> <div> <h1>音乐分类</h1> </div> <p>内容</p> </div> <div class="music_mod"> <h1>军事</h1> <p>内容</p> </div> <div class="music_mod"> <h1>娱乐</h1> <div> <h1>音乐分类</h1> <ul> <li> <h1>流行</h1> <p>流行前线</p> </li> <li> <h1>古典</h1> <p>古典曲目</p> </li> </ul> </div> <p>内容</p> </div>
霸气到哭。你再也不用管层级关系了，可以随心所欲地使用标题，你唯一需要担心的是，裸奔时候，页面奇丑无比。
但是，在我看来，这只能说是渲染机制不够好。文档渲染机制在标题上，应当根据文档的层级嵌套关系进行标题级别的渲染。
当然，我的这些示例只是对爆牙齿前辈的对h标题理解的一个补充。详见此文[深入结构：理解h系列的不合理。]
以上的示例似乎在说明h2,h3,h4,h5,h6的存在就是基本没用了，是吗？
好了，我们还需要考虑另外一种情况。用以证明h2,h3,h4,h5,h6的存在是合理的。
<h1>Let’s call it a draw(ing surface)</h1> <h2>Diving in</h2> <h2>Simple shapes</h2> <h2>Canvas coordinates</h2> <h3>Canvas coordinates diagram</h3> <h2>Paths</h2>
html5中引入了hgroup标签，用以对标题组进行分组。
我们再更改下对于h系列标题的渲染想法：同级h标题渲染根据标签来进行渲染，否则进行层级渲染。（yy一把）
5.表单标签。表单标签包含了form,label ,input,button,textarea,select,option等比较常见的标签。
详见：http://www.w3school.com.cn/html/html_forms.asp
需要注意的：
表单在input[type="text"]的情况下，回车会默认提交表单。
- 表单按钮通常需要指明按钮类型，type为submit或者button都得明确。
- 提交类型的按钮，id和name不能定义为submit。详见：http://huansinho.iteye.com/blog/869815
- 保存之类的跳转就用a标签，不必要使用按钮。
6.html5中的新增语义标签。
需要你们去关注下article和section的区别。其他基本没啥。
另外需要注意的是html标签的嵌套规则，这个可以查看一个经典的图示：
