Мы проведем сравнительный анализ двух противоборствующих подходов
к верстке веб-страниц в конце этой главы, когда познакомимся с техникой
создания таблиц более-менее полно.
Но само по себе это знакомство жизненно» необходимо, ибо даже если
читателю никогда не придется верстать какую бы то ни было страницу при
помощи таблиц (а в этом я, честно говоря, пока еще сомневаюсь). Сами по себе
таблицы не противоречат ни здравому смыслу, ни рекомендациям W3C, если
они используются по назначению, т. е. для структурирования данных, орга-
Глава 5. Таблицы в HTML 255
низованных подобающим образом, а их оформление определяется при
помощи CSS без применения визуальных атрибутов HTML.
Таблицы и блочная модель CSS — это не взаимоисключающие, а
взаимодополняющие инструменты, каждый из которых служит своим определенным
целям.
Создание простой «правильной» таблицы
Для описания таблиц в HTML используется три основных тега— ,
и отвечает заформирование ее строк; и, наконец, тег
.. .) может содержать в себе одну или несколько ячеек,
представленных элементами
.
Проще всего при помощи HTML реализовать описание правильной
таблицы — т. е. такой, которая содержит постоянное количество ячеек во всех
строках и неизменное число ячеек во всех столбцах.
Нижеследующий пример демонстрирует, как при помощи HTML можно
организовать в виде таблицы данные переписи населения 2002 г. о численности
жителей в крупнейших городах России.
^щ^^/^ШШ^
Ь «http://www.w3.org/TR/xhtmll/DTD/xhtmll-strict.dtd»>
256 Часть II. Применение веб-технологий стороны клиента для создания сайтов
|
. Каждый из них определяет элемент-контейнер, поэтому все
перечисленные теги являются парными. Тег определяет собственно таблицу; тег |
|
|
описывает ячейки таблицы.
Таблицы в HTML надлежит описывать построчно: каждая строка таблицы (элемент |
|
| .. . | |
| ropofl | Haceлeниe, тыс. чeл. |
| MocKBa | 10 383 |
| CaHKT-neTep6ypr | 4 661 |
| HoBOCM6MpcK | l 426 |
На рис. 5.1 представлен внешний вид документа, содержащего простейшую
таблицу, описанную в листинге 5.1.
гШШ*ШШШ№гШ&&
[