Может ли таблица HTML иметь переменное количество ячеек в строках?

Question

Или общее количество клеток должно равняться columns * rows?

Кажется, что таблица с разным количеством ячеек в разных строках проходит валидатор W3.

Answer 1

Это не нарушает определения. Но вы должны использовать атрибут colspan , чтобы развернуть столбец до всей строки:

<table>
  <tr>
    <td>Row with</td>
    <td>2 cols</td>
  </tr>
  <tr>
    <td colspan="2">Row with only one col</td>
  </tr>
</table>

Это также поможет, если у вас есть границы вокруг клеток.

Вы даже можете иметь таблицы со столбцом, который расширяется до двух строк:

<table>
  <tr>
    <td rowspan="2">First column in row 1 and row 2</td>
    <td>Second column in row 1</td>
  </tr>
  <tr>
    <td>second column in row 2</td>
  </tr>
</table>

Answer 2

Вы можете использовать colspan, но сумма, включающая значения colspan, должна быть равна для правильной визуализации таблицы.

<table>
  <tr>
     <td colspan="2">blah</td>
  </tr>
  <tr>
     <td>blah</td>
     <td>boo</td>
  </tr>
</table>

В первом ряду есть одна ячейка, но она охватывает 2 ячейки из-за colspan, во втором ряду есть две ячейки, и это совершенно правильно.

Answer 3

Да, может. В table > tr > td, td содержит содержимое.Td ссылка здесь: http://www.htmlcodetutorial.com/tables/_TD.html. В этой ссылке вы можете видеть, что у TD есть 2 атрибута: colspan и rowspan .Используя эти 2 атрибута, таблица может иметь разное количество ячеек в разных строках.
Демонстрация:

<table border="1">
     <tr>
          <td>a</td>
          <td>b</td>
     </tr>
     <tr> 
          <td colspan="2">c</td>
     </tr>
</table>

И

<table border="1">
     <tr>
          <td rowspan="2">a</td>
          <td>b</td>
     </tr>
     <tr> 
          <td>c</td>
     </tr>
</table>

Answer 4

Вы использовали:

<table>
<thead>
    <th>Column one</th>
    <th>Column two</th>
    <th>Column three</th>
</thead>
<tbody>
    <tr>
        <td rowspan="2">A large cell</td>
        <td>Another small cell0</td>
        <td>Another small cell0</td>
    </tr>
    <tr>
        <td>Another small cell1</td>
        <td>Another small cell1</td>
    </tr>
</tbody>

Answer 5

Да, вы можете создать таблицу HTML и пропустить элементы <td> в некоторых строках, но это считается плохим тоном, потому что вы не можете быть уверены, как HTML-рендерер (браузер) справится с этой ситуацией. В разных браузерах он может отображаться немного по-разному.

Рекомендуемый способ определения таблицы с различным количеством ячеек, отображаемых в строке, - использовать colspan для объединения двух или более соседних ячеек в одну. Это обеспечит выравнивание наиболее правильных ячеек с их правильными столбцами и устранит любую двусмысленность относительно того, что вы хотите, чтобы делал средство визуализации HTML.