Таблицы в HTML позволяют не только представлять данные в табличной форме, но и формировать дизайн страницы сайта, размещая в нужных местах фрагменты текста, картинки, меню, рекламные объявления и другие визуальные элементы.
Начало и конец таблицы обозначаются тегами
и
соответственно. Строки – тегами
, а ячейки –
.
Содержание вписывается между тегами
и
. Простейшая таблица формируется следующим набором тегов:
контент
контент
контент
текст
текст
текст
В этой таблице 2 строки и 3 столбца.
В теге
задают параметры таблицы: ширину WIDTH, высоту HEIGHT, расположение по ширине страницы ALIGN, рамку BORDER, рамки между ячейками CELLSPACING, отступ между рамкой и содержимым ячейки CELLPADDING, цвет рамки BORDERCOLOR.
Например, запишем
. Получим таблицу шириной 60% от ширины экрана (фиксированную ширину задают в пикселях). Ее высота составит 100 пикселей. Расположится она посредине страницы (left – слева страницы, right – справа). Рамки ячеек совместятся (CELLPADDING="1" даст двойную рамку с расстоянием между линиями равным 1 пикселю, а при BORDER="0" рамка таблицы станет невидимой). Отступ между содержимым и рамкой ячейки будет равным 2 пикселям.
В тегах
задают высоту (HEIGHT) и ширину (WIDTH) ячеек. При этом высота всех ячеек ряда должна быть одинакова, а ширина одинакова у ячеек столбца.
Тегом
можно объединить несколько ячеек ряда, записав
. Эта и следующие за ней 2 ячейки объединятся в одну. Этот же тег позволяет объединить ячейки столбца. Конструкция
объединит ячейку этого ряда с расположенной ниже ячейкой следующего ряда. Поэтому в следующем ряду теги «
содержание
» этой ячейки не прописывают. По этому принципу можно объединить и большее количество ячеек столбца.
На каждую из ячеек таблицы распространяется действие каскадных таблиц стилей текущей страницы. При этом следует учитывать различие в отображении одного и того же html кода различными браузерами.
182 |
0
