zoukankan      html  css  js  c++  java
  • 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 元素内部使用这些标签。

  • 相关阅读:
    Leetcode 乘积最大子数组 (两种思路)
    C++string函数库-->to_string
    Zigzags CodeForces
    石子游戏(Leetcode每日一题)
    树形dp入门题(Leetcode 337. 打家劫舍 III)
    E
    背包九讲
    通过树状dp来求树的直径
    329. 矩阵中的最长递增路径(Leetcode每日一题)
    关于图的匹配,边覆盖,独立集,顶点覆盖
  • 原文地址:https://www.cnblogs.com/zhaoyingli/p/5388670.html
Copyright © 2011-2022 走看看