TABLE


CAPTION
COL
COLGROUP
TABLE
TBODY
TD
TFOOT
TH
THEAD
TR


Элемент <TABLE> служит контейнером для элементов, определяющих содержимое таблицы. Каждая таблица состоит из рядов (строк) и ячеек. В каждый контейнер строки <TR> помещается один или несколько контейнеров ячеек <TD> с возможностью задания индивидуальных параметров и стилей отображения.

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


<body>
<table border="1" width="400" height="100" bgcolor="#f2f3d2">

<tr>
<td width="200" style="padding-left: 10; background-color: #111111;
color: #ffffff;">Ячейка 1, Ряд 1</td>
<td width="200" style="padding-left: 10; color: #7b3f2c;">
Ячейка 2, Ряд 1</td>
</tr>

<tr>
<td style="padding-left: 10;  background-color: #cfcfcf;"
colspan="2" align="center">Ячейка 1, Ряд 2</td>
</tr>

</table>
</body>

Ячейка 1, Ряд 1 Ячейка 2, Ряд 1
Ячейка 1, Ряд 2


Параметры:

align Определяет выравнивание таблицы
background Задает фоновый рисунок в таблице
bgcolor Цвет фона таблицы
border Толщина рамки в пикселах
bordercolor Цвет рамки
cellpadding Отступ от рамки до содержимого ячейки
cellspacing Расстояние между ячейками
cols Число колонок в таблице
height Высота таблицы
width Ширина таблицы
rules Управляет отображением границ между ячейками





Параметр ALIGN

Задает выравнивание таблицы.

center Выравнивание таблицы по центру
left Выравнивание по левому краю*
right Выравнивание по правому краю


<table align="center">


Параметр BACKGROUND

Определяет фоновый рисунок для таблицы, который будет взят из графического файла по указанному пути. Размеры фонового рисунке невозможно изменить, он всегда отображается в натуральную величину.

Если рисунок по размеру меньше ширины или высоты таблицы, то картинка повторяется по горизонтали вправо и вниз, выстраиваясь, как мозаика. По этой причине на месте стыка фоновых картинок могут возникнуть видимые перепады, заметные для посетителей сайта. Этот недостаток можно устранить, используя стили CSS. Аналогичным параметром в CSS, для создания фона таблицы, является параметр background-image.

<table background="URL">...</table>


Параметр BGCOLOR

Устанавливает цвет фона таблицы. Можно использовать этот параметр совместно с background, подобрав цвет фона близкий к фоновому рисунку. Также для каждой ячейки в таблице можно будет назначить свой цвет фона и фоновый рисунок, который будет накладываться поверх основного. Аналогичным параметром в CSS является background-color.

<table bgcolor="цвет">...</table>


Параметр BORDER

Устанавливает толщину рамки в пикселях для данной таблицы. По умолчанию рамка будет отсутствовать, т.е. размер ее будет равен "0".


Параметр BORDERCOLOR

Устанавливает цвет рамки в таблице. Данный параметр поддерживается не всеми браузерами, поэтому для этих целей рекомендуется использовать аналогичный параметр в CSS - border-color.

<table bordercolor="цвет">...</table>
<table style="border-color: 'цвет';">...</table>


Параметр CELLPADDING

Определяет расстояние между границей ячейки и ее содержимым. Этот параметр добавляет пустое пространство к ячейке, увеличивая тем самым ее размеры. Без cellpadding текст в таблице «налипает» на рамку, снижая тем самым его восприятие. Добавление же cellpadding позволяет улучшить читабельность текста. При отсутствии границ особого значения этот параметр не имеет, но может помочь, когда требуется установить пустой промежуток между ячейками.

<table cellpadding="значение">...</table>


Параметр CELLSPACING

Задает расстояние между внешними границами ячеек. Если установлен параметр border, толщина границы принимается в расчет.

<table cellspacing="значение">...</table>


Параметр COLS

Данный параметр помогает ускорить загрузку таблицы, заранее определяя количество создаваемых столбцов.

<table cols="число">...</table>


Параметр FRAME

Управляет отображением границ вокруг таблицы. Аналогичный параметр в CSS - border.

void Не отрисовывать границы
border Граница вокруг таблицы*
above Граница по верхнему краю таблицы
below Граница снизу таблицы
hsides Добавить только горизонтальные границы (сверху и снизу таблицы)
vsides Рисовать только вертикальные границы (слева и справа от таблицы)
rhs Граница только на правой стороне таблицы
lhs Граница только на левой стороне таблицы


<table frame="void">


Параметры HEIGHT и WIDTH

Устанавливают высоту и ширину таблицы. Хотя большинство браузеров и понимают эти параметры в теге <TABLE>, лучше управлять высотой таблицы, проставляя соответствующие параметры в тегах <TD>, <COL> или <COLGROUP>.


Параметр RULES

Управляет отображением границ между ячейками. По умолчанию, при включенном параметре border, рамка рисуется вокруг каждой ячейки, образуя тем самым сетку.

all Линия рисуется вокруг каждой ячейки таблицы*
groups Линия отображается между группами, которые образуются тегами <THEAD>, <TFOOT>, <TBODY>, <COLGROUP> или <COL>
cols Линия отображается между колонками
none Все границы скрываются
rows Граница рисуется между строками таблицы, созданых через тег



С чего начать работу? Структура HTML
Гиперссылки
Текстовые блоки
Форматирование и текстовые элементы
Списки
Объекты
Таблицы
Формы
Фреймы
Метатэги и служебные теги
Все теги по алфавиту
Каскадные таблицы стилей CSS
Кодирование цвета в HTML
Коды символов в HTML
MIME-типы


Студия web-дизайна "Webcreature" © 2015
+7 (905) 515-56-52
Rambler's Top100