HTML5常见标签总结（二）

        接着上篇文章所讨论的内容，我们接着来介绍HTML5当中的其它标签。

五、列表标签

        ①无序列表

        ul标签表示无需列表的整体，用于包裹li标签；li标签表示无序列表当中每一项，可包含任何内容：

<ul>
    <li>榴莲</li> 
    <li>香蕉</li>
    <li>苹果</li>
</ul>

        ②有序列表

        与无序列表不同的一点在于，有序列表把ul换成了ol：

<ol>
    <li>榴莲</li> 
    <li>香蕉</li>
    <li>苹果</li>
</ol>

        ③自定义列表

        dl表示自定义列表的整体，dt表示自定义列表的主题，dd表示自定义列表针对主题的每一项内容。下列代码的效果如图所示：

<dl>
    <dt>帮助中心</dt>
    <dd>账户管理</dd>
    <dd>购物指南</dd>
</dl>

 六、表格标签

        基本标签为table标签（用于表示表格的整体，可包含多个tr标签）、tr标签（用于表示表格的每行，可用于包裹td标签）、td标签（表示表格单元格，可用于包裹内容）。除此之外，还有th标签（与td标签相同，只不过有加粗效果）、caption标签（表格的大标题，表示表格整体的大标题，默认在表格整体顶部居中位置显示）。

        另外，可以设置table标签的相关属性，如border、width、height等属性，其中width、height等属性建议用CSS解决，border属性是设置表格的边框宽度，只有设置了border属性才会有表格的网状线。

<table border="5" width="100" height="200">
    <caption>表单</caption> 
    <tr>
        <th>水果名称</th>
        <th>单价</th>
        <th>重量</th>
    </tr>
    <tr>
        <td>苹果</td>
        <td>5</td>
        <td>4</td>
    </tr>
    <tr>
        <td>香蕉</td>
        <td>4</td>
        <td>2</td>
    </tr>
</table>

        效果如下图所示：

        另外有一点不得不提到就是表格的单元格合并功能的代码实现：若要跨行合并，则可以设置td标签或者th标签的rowspan属性的值；若要跨列合并，则可以设置td标签或者th标签的colspan属性的值。