HTML5学习笔记(四):关于表格

  在一个实例中碰到表格,总结下,先上代码,例:

<table border="1">
        <thead>
            <th>表头</th>
            <th>表头</th>
            <th>表头</th>
        </thead>
        <tbody>
            <tr>
                <td>表内容单元格</td>
                <td>表内容单元格</td>
                <td><a href="#">操做</a></td>
            </tr>
            <tr>
                <td>表内容单元格</td>
                <td>表内容单元格</td>
                <td><a href="#">操做</a></td>
            </tr>
            <tr>
                <td>表内容单元格</td>
                <td>表内容单元格</td>
                <td><a href="#">操做</a></td>
            </tr>
            <tr>
                <td>表内容单元格</td>
                <td>表内容单元格</td>
                <td><a href="#">操做</a></td>
            </tr>
        </tbody>
        <tfoot>
            <tr>
                <td>总计</td>
                <td colspan="2">1000</td>
            </tr>
        </tfoot>
    </table>

  显示效果以下:

  总结:

  • <thead>标签:用于定义表格的表头,该标签用于组合 HTML 表格的表头内容;<thead> 内部必须拥有 <tr> 标签!

   <th> 元素内部的文本一般会呈现为居中的粗体文本,而 td 元素内的文本一般是左对齐的普通文本。浏览器

  • <tbody>标签:用于对 HTML 表格中的主体内容进行分组;
  • <tfoot>标签:用于对 HTML 表格中的表注(页脚)内容进行分组;

若是使用 thead、tfoot 以及 tbody 元素,就必须使用所有的元素。它们的出现次序是:thead、tfoot、tbody,这样浏览器就能够在收到全部数据前呈现页脚了,而且必须在 table 元素内部使用这些标签。spa

相关文章
相关标签/搜索