HTML tbody 的目的是什么? [英] What is the purpose for HTML's tbody?

查看:16
本文介绍了HTML tbody 的目的是什么?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

人们在表格中使用 HTML 的 tbody 的主要原因是什么?只是为了格式化吗?

What are the main reasons someone would use HTML's tbody in a table? Is it just for formatting purposes?

我一般使用headbody;我没有用过 theadtbody.

I use head and body generally; I haven't used thead and tbody.

推荐答案

赋予表格语义:

<table>
  <thead>
    <tr>
      <th>Person</th>
      <th>Amount</th>
      <th>Date</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>Person1</td>
      <td>$5.99</td>
      <td>02/03/09</td>
    </tr>
    <tr>
      <td>Person2</td>
      <td>$12.99</td>
      <td>08/15/09</td>
    </tr>
  </tbody>
</table>

根据规范:

可以分别使用 THEAD、TFOOT 和 TBODY 元素将表格行分组为表格头、表格脚和一个或多个表格主体部分.这种划分使用户代理能够独立于表头和表脚来支持滚动表体.打印长表时,可能会在包含表数据的每一页上重复表头和表脚信息.

Table rows may be grouped into a table head, table foot, and one or more table body sections, using the THEAD, TFOOT and TBODY elements, respectively. This division enables user agents to support scrolling of table bodies independently of the table head and foot. When long tables are printed, the table head and foot information may be repeated on each page that contains table data.

表头和表脚应包含有关表列的信息.表格主体应包含表格数据行.

The table head and table foot should contain information about the table's columns. The table body should contain rows of table data.

当存在时,每个 THEAD、TFOOT 和 TBODY 都包含一个行组.每个行组必须至少包含一行,由 TR 元素定义.

When present, each THEAD, TFOOT, and TBODY contains a row group. Each row group must contain at least one row, defined by the TR element.

除了这一重要的语义重要性(想想屏幕阅读器)之外,您还可以轻松地将标题与数据行区分开来.另一个相关示例是 jQuery 插件,例如 Tablesorter (original, archived) 插件可以很容易地找出你的数据结构是什么样的.

Besides the important semantic importance of this (think screen readers), you can then easily style your headers apart from your data rows. Another relevant example is jQuery plugins such as the Tablesorter (original, archived) plugin can then easily figure out what your data structure looks like.

这篇关于HTML tbody 的目的是什么?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆