• table的thead/tbody/tfoot/tr/th/td (转)


    摘自:http://www.cnblogs.com/suizhikuo/archive/2012/05/24/2517190.html

    为了让大表格(table)在下载的时候可以分段的显示,就是说在浏览器解析HTML时,table是作为一个整体解释的,使用tbody可以优化显示。如果表格很长,用tbody分段,可以一部分一部分地显示,不用等整个表格都下载完成。下载一块显示一块,表格巨大时有比较好的效果。

    tbody包含行的内容下载完优先显示,不必等待表格结束.另外,还需要注意一个地方。表格行本来是从上向下显示的。但是,应用了thead/tbody/tfoot以后,就"从头到脚"显示,不管你的行代码顺序如何。也就是说如果thead写在了tbody的后面,html显示时,还是以先thead后tbody显示。

    table中的thead/tbody/tfoot/tr/th/td的包含关系:

    <table>
    <thead>
    <tr>
    <th>这是在thead->tr->th里面</th>
    <td>这是在thead->tr->td里面</td>
    </tr>
    </thead>
    <tbody>
    <tr>
    <th>这是在thead->tr->th里面</th>
    <td>这是在thead->tr->td里面</td>
    </tr>
    </tbody>
    <tfoot>
    <tr>
    <th>这是在thead->tr->th里面</th>
    <td>这是在thead->tr->td里面</td>
    </tr>
    </tfoot>
    </table>
    <table>
    <thead>
    <tr>
    <th>这是在thead->tr->th里面</th>
    <td>这是在thead->tr->td里面</td>
    </tr>
    </thead>
    <tbody>
    <tr>
    <th>这是在thead->tr->th里面</th>
    <td>这是在thead->tr->td里面</td>
    </tr>
    </tbody>
    <tfoot>
    <tr>
    <th>这是在thead->tr->th里面</th>
    <td>这是在thead->tr->td里面</td>
    </tr>
    </tfoot>
    </table>

    其中thead/tbody/tfoot可省略

    <table>是<tr>的上层标签
    <tr>必须在一个<table></table>里面,它不能单独使用,相当于<table>的属性标签.
    <table>标示一个表格,<tr>标示这个表格中间的一个行
    <td>标示行中的一个列,需要嵌套在<tr></tr>中间

    具体格式是:(两行两列)
    <table>
    <tr>
    <td></td>
    <td></td>
    </tr>
    </teble>

    <th>和<td>一样,也是需要嵌套在<tr>当中的,<tr>嵌套在<table>当中

    <table>...</table> 用于定义一个表格开始和结束

    <th>...</th> 定义表头单元格。表格中的文字将以粗体显示(<TH>与<TD>同样是标示一个储存格,唯一不同的是<TH>所标示的储存格中的文字是以粗体出现,即可以这样看:
    <th>文字</th>=<td><b>文字</b></td>
    ),
    在表格中也可以不用此标签,<th>标签必须放在<tr>标签内

    <tr>...</tr> 定义一行标签,一组行标签内可以建立多组由<td>或<th>标签所定义的单元格

    <td>...</td> 定义单元格标签,一组<td>标签将将建立一个单元格,<td>标签必须放在<tr>标签内

    。<th>为表格标题,属性summar为摘要,<caption>标签为首部说明,<thead>标签为表格头部,<tbody>标签为表格主体内容,<tfoot>标签为表格尾部。
    其中还可以使用scope 可用于取代headers属性,标记含有表头信息的单元格,其中各数值的内容如下:
    row 指示当前单元格,为包含当前单元格的行提供相关的表头信息。
    col 指示当前单元格,为根据当前单元格指定的列提供相应的表头信息。
    rowgroup 指示当前单元格,为包含当前单元格的其余行组提供相关的表头信息。
    colgroup 指示当前单元格,为根据当前单元格指定的其余列组提供相应的表头信息。
    abbr 用于定义表头单元格中的缩写名,如果没有定义该属性,则将默认单元格内容为节略形式。
    标准表格模型
    <table>
    <caption></caption>
    <thead>
    <tr>
    <th></th>
    </tr>
    </thead>
    <tbody>
    <tr>
    <td></td>
    </tr>
    </tbody>
    <tfoot>
    <tr>
    <td></td>
    </tr>
    </tfoot>
    </table>

    相关:

    <th>不光是粗体,还是居中的
    <caption>也是居中的,而且如果table有border的话则caption不在border之内
    TFOOT 元素内包含的有效标签有:
    TD
    TH
    TR
    任何给定的 table 对象都只能定义一个 tFoot。

  • 相关阅读:
    uibot获取excel指定行数据并输出到新的excel边
    飒瑞S21F产品说明书
    python新建文件并全文设置文本格式
    mac安装frida各种报错坑
    linuxtomcat 开机自启动
    记录Flink On Yarn taskmanager分配不均匀问题
    redis13_命令操作redis2
    测试随笔
    小学生学习汉字,汉字抓取
    c# regex regextools
  • 原文地址:https://www.cnblogs.com/KeenLeung/p/2682555.html
Copyright © 2020-2023  润新知