Подтвердить что ты не робот

Какова цель для HTML-тета?

Каковы основные причины, по которым кто-то использовал бы HTML tbody в таблице? Это просто для форматирования?

Я использую head и body в целом; Я не использовал thead и tbody.

4b9b3361

Ответ 1

Чтобы дать семантический смысл вашей таблице:

<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 соответственно. Это разделение позволяет агентам пользователей поддерживать прокрутку тел таблицы независимо от головы и стопы стола. Когда печатаются длинные таблицы, информация о голове и стопе таблицы может повторяться на каждой странице, содержащей данные таблицы.

Стол для таблицы и стола должен содержать информацию о столбцах таблицы. Тело таблицы должно содержать строки данных таблицы.

Когда присутствует, каждый THEAD, TFOOT и TBODY содержат группу строк. Каждая группа строк должна содержать по крайней мере одну строку, определенную элементом TR.

Помимо важной семантической важности этого (считыватели экранного экрана), вы можете легко стилизовать свои заголовки отдельно от строк данных. Другим важным примером являются плагины jQuery, такие как плагин Tablesorter, который затем может легко определить, как выглядит ваша структура данных.

Ответ 2

Одно замечательное использование, которое я нашел для tbody, - это позволить прокручивать строки, сохраняя верхний и нижний колонтитулы столбца. Это работает только в браузерах, которые фактически поддерживают CSS. Извините, Internet Explorer!

<tbody style="height: 150px; overflow-y: scroll">

Ответ 3

Что делать, если заголовок таблицы является первым столбцом в каждой строке? В этом случае нет способа указать заголовок таблицы. Это фактически разрушит HTML, поскольку парсер будет считать, что все является частью тела таблицы.

И почему именно этот тег необходим, так как th указывает поля заголовка - браузер может узнать, какая часть таблицы является заголовком этими полями.

Какая точка твоей и тёмной? Они работают в некоторых случаях и нарушают HTML в других случаях. Они дублируют функциональность th. Они усложняют код и могут вызвать проблемы. Прежде чем я узнал об этом, я предположил, что tr-s являются дочерними элементами таблицы.

Ответ 4

Отделить части заголовка (thead), body (tbody) и нижнего колонтитула (tfoot) таблицы HTML. Это невероятно полезно. Типичное использование заключается в том, чтобы помещать заголовки столбцов в ваш элемент thead и данные в tbody. Элемент tfoot менее распространен, но иногда полезен.

Кстати, даже если вы не укажете tbody, он неявно создан для вас в любом случае.

Вы также можете использовать это для стилизации, например:

table thead tr { background-color: yellow; }
table tbody tr { background-color: #C9C9C9; }

Он также полезен в Javascript и jQuery для наличия таблиц с возможностью выбора строк (как один пример). Обычно вас интересует только выбор или выделение строк в теле, а не строка заголовка вверху.

Ответ 5

Его можно использовать для стилизации, да, а также полезно для селекторов jQuery, чтобы распознавать элементы, которые вы хотите выбрать. В конце концов, вы можете иметь тэг-теги в аде или теле.

Ответ 6

Элементы thead, tbody и tfoot в HTML используются для группировки строк таблицы в логические разделы на основе их содержимого. Есть две основные причины, которые вы хотели бы сделать:

  • Чтобы позволить телу прокручиваться независимо от заголовка и/или нижнего колонтитула
  • Чтобы упростить применение разных правил стиля к различным разделам таблицы.

<table>
  <thead>
  <tr>
     <th>Month</th>
     <th>Savings</th>
  </tr>
  </thead>
  <tfoot>
  <tr>
      <td>Sum</td>
      <td>$180</td>
  </tr>
  </tfoot>
  <tbody>
  <tr>
     <td>January</td>
     <td>$100</td>
  </tr>
  <tr>
      <td>February</td>
      <td>$80</td>
  </tr>
  </tbody>
</table>