Объединение строк и столбцов

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

Атрибут colspan используется для указания количества столбцов, которые должна охватывать ячейка. Он добавляется к тегу <td> или <th> той ячейки, которую вы хотите расширить.

Вот пример того, как использовать colspan:

<table border="1">
	<tr>
		<th colspan="2">Name</th>
	</tr>
	<tr>
		<td>John</td>
		<td>Doe</td>
	</tr>
</table>

В этом примере ячейка заголовка с текстом "Name" объединяет два столбца. Это полезно для создания заголовка, который охватывает несколько столбцов. Вот как это выглядит:

Атрибут rowspan используется для указания количества строк, которые должна охватывать ячейка. Он также добавляется к тегу <td> или <th> той ячейки, которую вы хотите расширить.

Вот пример того, как использовать rowspan:

<table border="1">
  <tr>
    <th>Employee</th>
    <th>Shift</th>
  </tr>
  <tr>
    <td rowspan="2">Alex</td>
    <td>Morning</td>
  </tr>
  <tr>
    <td>Evening</td>
  </tr>
</table>

Здесь rowspan используется для того, чтобы показать, что Алекс работает как в утреннюю, так и в вечернюю смену, не повторяя имя. 

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