澳门新葡萄京官网首页table 不常用内容-caption


不论标签出现的顺序如何,在显示时 thead 总是在表格的最上方,tfoot
总是在表格的最下方。如果省略这三个标签,浏览器会默认用 tbody 来解释。

  • table 不常用内容-caption
  • table
    不常用内容-th
  • table
    不常用内容-thead、tbody、tfoot
  • table
    不常用内容-colgroup、col
  • table
    不常用内容-frame
  • table 不常用内容-rules

表头也可以在左边:

这三个标签都位于 table 和 tr
之间。最初,人们提出这三个标签希望:在滚动表格时表头、表脚固定,只有表体滚动;同时打印时,每一张纸上都有表头、表脚。但实际上浏览器并不支持这样的特性。但
thead、tbody、tfoot 还是有用的:尤其是在 DOM
应用中,比如我们可以很方便地重复 tbody 的内容,而不受 thead、tfoot
的影响;或者我们也可以通过 CSS 作高级的应用。


th 标签用来定义表头。用 th 代替 td,此时该单元格的内容会以粗体显示。

  • table
    不常用内容-caption
  • table
    不常用内容-th
  • table 不常用内容-thead、tbody、tfoot
  • table
    不常用内容-colgroup、col
  • table
    不常用内容-frame
  • table 不常用内容-rules

[Ctrl+A 全部选择 提示:您可先修改部分代码,再按运行]


thead、tbody、tfoot 这三个标签分别表示表头、表体、表脚,前面说了 th
也表示表头,但 th 只是将单元格的文字粗体显示罢了,而 thead 的意义和 th
完全不同。

<table border=”1″> <caption>表格标题</caption>
<tr> <td>11</td> <td>12</td> </tr>
<tr> <td>21</td> <td>22</td> </tr>
</table>

  • table
    不常用内容-caption
  • table 不常用内容-th
  • table
    不常用内容-thead、tbody、tfoot
  • table
    不常用内容-colgroup、col
  • table
    不常用内容-frame
  • table 不常用内容-rules

 


[Ctrl+A 全部选择 提示:您可先修改部分代码,再按运行]


可以看出 table 的边框并没有将 caption 包括在内。另外 caption 有属性
align,但并不推荐使用,而应该用样式表去控制标题的对齐方式。

 

[Ctrl+A 全部选择 提示:您可先修改部分代码,再按运行]

  • table 不常用内容-caption
  • table
    不常用内容-th
  • table
    不常用内容-thead、tbody、tfoot
  • table
    不常用内容-colgroup、col
  • table
    不常用内容-frame
  • table 不常用内容-rules

<table border=”1″> <tr> <th>姓名</th>
<td>张三</td> </tr> <tr>
<th>联系电话</th> <td>12345678</td> </tr>
</table>

  • table
    不常用内容-caption
  • table
    不常用内容-th
  • table 不常用内容-thead、tbody、tfoot
  • table
    不常用内容-colgroup、col
  • table
    不常用内容-frame
  • table 不常用内容-rules

caption 标签用来定义表格的标题,它必须紧随 table
标签之后,一个表格只能有一个 caption。

<table border=”1″> <tr> <th>姓名</th>
<th>成绩</th> </tr> <tr>
<td>张三</td> <td>90</td> </tr> <tr>
<td>李四</td> <td>91</td> </tr>
</table>

<table border=”1″> <thead> <tr>
<th>姓名</th> <th>成绩</th> </tr>
</thead> <tbody> <tr> <td>张三</td>
<td>90</td> </tr> <tr> <td>李四</td>
<td>91</td> </tr> </tbody> </table>

[Ctrl+A 全部选择 提示:您可先修改部分代码,再按运行]


  • table
    不常用内容-caption
  • table 不常用内容-th
  • table
    不常用内容-thead、tbody、tfoot
  • table
    不常用内容-colgroup、col
  • table
    不常用内容-frame
  • table 不常用内容-rules

发表评论

电子邮件地址不会被公开。 必填项已用*标注