Расширенные возможности форматирования таблиц

Современные браузеры предлагают несколько способов настройки таблиц. При использовании каждого из этих методов подразумевается, что вы аккуратно сосчитали количество строк и столбцов. В каждом из разделов вы увидите измененную версию простой нашей "бейсбольной" таблицы.

Объединение нескольких строк в одну ячейку

Если вы будете часто применять таблицы, то непременно столкнетесь с ситуацией, когда какая-либо ячейка должна занимать несколько строк таблицы. Здесь вам пригодится параметр ROWSPAN, который добавляется в тэг <td> заданной ячейки. Чтобы ячейка занимала две строки вместо одной, замените ваш код, например <td>текст вашей простой ячейки</td> на <td rowspan=2> расширенный текст</td>. Теперь при отображении таблицы ячейка с ключевым словом ROWSPAN займет две строки. Так можно изменить бейсбольную таблицу:

<table align="center" border="1"> <tr> <th>Имя</th> <th>Команда</th> <th>Победы/поражения</th> <th>Очки</th> <th>Ауты</th> </tr> <tr> <td>Пит Шурек</td> <td rowspan=2>Цинциннати</td> <td>16-2</td> <td>2,73</td> <td>194</td> </tr> <tr> <td>Хосе Рио</td> <td>28-2</td> <td>1,92</td> <td>199</td> </tr> </table>

Вот что получится в результате:

Имя Команда Победы/поражения Очки Ауты Пит Шурек Цинциннати 16-2 2,73 Хосе Рио 28-2 1,92

Объединение нескольких столбцов в одну ячейку

Подобно тому, как ROWSPAN распространяет ячейку на несколько строк, COLSPAN "раздвигает" ее на несколько столбцов. С помощью ключевого слова COLSPAN вы можете распространить ячейку на любое количество столбцов.

<table align="center" border="1"> <tr> <th colspan=2>Личная информация</th> <th colspan=3>Статистика</th> </tr> <tr> <th>Имя</th> <th>Команда</th> <th>Победы/поражения</th> <th>Очки</th> <th>Ауты</th> </tr> <tr> <td>Пит Шурек</td> <td>Цинциннати</td> <td>16-2</td> <td>2,73</td> <td>194</td> </tr> <tr> <td>Гидео Немо</td> <td>Лос-Анджелес</td> <td>19-8</td> <td>2,94</td> <td>399</td> </tr> <tr> <td>Грег Энгриус</td> <td>Атланта</td> <td>24-6</td> <td>2,21</td> <td>275</td> </tr> </table>
Личная информация Статистика Имя Команда Победы/поражения Очки Ауты Пит Шурек Цинциннати 16-2 2,73 Гидео Немо Лос-Анджелес 19-8 2,94 Грег Энгриус Атланта 24-6 2,21

Понравилась статья? Добавь ее в закладку (CTRL+D) и не забудь поделиться с друзьями:  



double arrow
Сейчас читают про: