Для объединения двух и более ячеек в одну используются атрибуты colspan и rowspan тега <td>. Атрибут colspan устанавливает число ячеек объединяемых по горизонтали. Аналогично работает и атрибут rowspan, с тем лишь отличием, что объединяет ячейки по вертикали. Перед добавлением атрибутов проверьте число ячеек в каждой строке, чтобы не возникло ошибок. Так, <td colspan="3"> заменяет три ячейки, поэтому в следующей строке должно быть три тега <td> или конструкция вида <td colspan="2">...</td><td>...</td>. Если число ячеек в каждой строке не будет совпадать, появятся пустые фантомные ячейки. В примере 12.3 приведен хотя и валидный, но неверный код, в котором как раз проявляется подобная ошибка. Пример 12.3. Неверное объединение ячеек HTML 4.01IE 7IE 8IE 9Cr 11Op 11Sa 5Fx 4 Результат данного примера показан на рис. 12.5.
Рис. 12.5. Появление дополнительной ячейки в таблице В первой строке примера задано три ячейки, две из них объединены с помощью атрибута colspan, а во второй строке добавлено только две ячейки. Из-за этого возникает дополнительная ячейка, которая отображается в браузере. Ее хорошо видно на рис. 12.5. Правильное использование атрибутов colspan и rowspan продемонстрировано в примере 12.4. Пример 12.4. Объединение ячеек по вертикали и горизонтали HTML 4.01IE 7IE 8IE 9Cr 11Op 11Sa 5Fx 4 Результат данного примера показан на рис. 12.6.
Рис. 12.6. Таблица с объединенными ячейками В данной таблице установлено восемь колонок и три строки. Часть ячеек с надписями «Internet Explorer» , «Opera» и «Firefox» объединены где по две, а где и по три ячейки. В ячейке с надписью «Браузер» применено объединение по вертикали. | |
| Просмотров: 461 | Теги: | Рейтинг: 0.0/0 |
| Всего комментариев: 0 | |