Студопедия

Главная страница Случайная страница

Разделы сайта

АвтомобилиАстрономияБиологияГеографияДом и садДругие языкиДругоеИнформатикаИсторияКультураЛитератураЛогикаМатематикаМедицинаМеталлургияМеханикаОбразованиеОхрана трудаПедагогикаПолитикаПравоПсихологияРелигияРиторикаСоциологияСпортСтроительствоТехнологияТуризмФизикаФилософияФинансыХимияЧерчениеЭкологияЭкономикаЭлектроника






Таблицы. Основные тэги таблиц и их атрибуты






Основные тэги таблиц и их атрибуты

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

Элемент TABLE представляет собой тэг-контейнер, в котором размещается содержимое таблицы. Этот контейнер напоминает контейнер списка.

Таблица строится по строкам: для обозначения строки используется контейнер TR, для обозначения заголовков столбцов (строк) - контейнер TH, а для данных в ячейках - контейнер TD. Заголовки выделяются полужирным шрифтом и центрируются в своих ячейках. Данные имеют обычный шрифт и выравниваются по левой стороне ячейки. Ниже приведен список основных тэгов таблиц:

· < TABLE> < /TABLE> - контейнер таблицы.

· < TR> < /TR> - контейнер строки таблицы. Допускается отсутствие закрывающего тэга.

· < TD> < /TD> - контейнер ячейки таблицы. В ячейку можно включить другую таблицу. Закрывающий тэг может быть опущен.

· < TH> < /TH> - контейнер заголовка, располагающегося обычно в первой строке, либо в первом столбце таблицы. Закрывающий тэг необязателен.

В дополнение к этим тэгам используются следующие атрибуты:

· BORDER тэга < TABLE> - для определения рамки таблицы. Ширина рамки устанавливается в пикселах, например BORDER=1 (значение, равное нулю, означает отсутствие рамки).

· ALIGN тэга < TABLE> - для выравнивания таблицы в окне браузера. Имеет значения LEFT, CENTER и RIGHT (по умолчанию - LEFT).

Ниже приведен фрагмент HTML - кода и его интерпретация браузером

< TABLE BORDER=1>
< TR>
< TD> Item1 < /TD>
< TD> Item2< /TD>
< /TR>
< TR>
< TD> Item3 < /TD>
< TD> Item4 < /TD>
< /TR>
< /TABLE>

Item1 Item2
Item3 Item4

Наличие в ячейках данных необязательно. Создать пустую ячейку можно двумя способами: ничем не заполнять ее контейнер (< TD> < /TD>), любо заполнить ее специальным символом пустого пространства & nbsp; (< TD> & nbsp; < /TD>). При выводе пустых ячеек браузер Microsoft Internet Explorer объединяет их. Ячейки с невидимым содержанием выводятся раздельно.

Размещение данных внутри ячеек

При помощи атрибутов ALIGN и VALIGN можно по-разному размещать данные относительно границ ячейки. Эти атрибуты используются совместно с элементами < CAPTION>, < TR>, < TH> и < TD> в самых различных комбинациях. Ниже приведены значения атрибутов для этих элементов:

· < CAPTION> - атрибут ALIGN может иметь значения TOP и BOTTOM (по умолчанию - TOP); размещает заголовок таблицы сверху или снизу.

· < TR> - атрибут ALIGN может принимать значения LEFT, CENTER и RIGHT (по умолчанию - LEFT для данных, CENTER для заголовков); он определяет горизонтальное выравнивание данных в ячейках и действует на всю строку, если он не отменяется тем же атрибутом в отдельной ячейке. Атрибут VALIGN может иметь значения TOP, BOTTOM, MIDDLE и BASELINE (по умолчанию - MIDDLE); он регулирует положения данных относительно верхней и нижней границ ячейки и влияет на всю строку, если не отменяется таким же атрибутом в отдельной ячейке. BASELINE применяется ко всем элементам строки и выравнивает их по базовой линии.

· < TH> - атрибут ALIGN может принимать значения LEFT, CENTER и RIGHT (по умолчанию - CENTER). Атрибут VALIGN может иметь значения TOP, BOTTOM и MIDDLE (по умолчанию - MIDDLE).

· < TD> - атрибут ALIGN может принимать значения LEFT, CENTER и RIGHT (по умолчанию - LEFT). Атрибут VALIGN может иметь значения TOP, BOTTOM и MIDDLE (по умолчанию - MIDDLE).

Объединение ячеек

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

Для соединения двух смежных ячеек в одном столбце нужно использовать атрибут ROWSPAN тэга < TH> или < TD>, например:

< TD ROWSPAN=2>

Для объединения двух смежных ячеек в одной строке нужно использовать атрибут COLSPAN тех же тэгов, например:

< TD COLSPAN=2>

Новые атрибуты таблиц

В HTML версии 3.2 введены несколько новых атрибутов таблиц. Ниже приведен их список:

· WIDTH - определяет ширину всей таблицы в пикселах, либо в процентах от ширины окна браузера. Может также использоваться для отдельной ячейки.

· HEIGHT - определяет высоту всей таблицы в пикселах, либо в процентах от ширины окна браузера. Может также использоваться для отдельной ячейки.

· BORDER - устанавливает ширину рамки в пикселах.

· CELLPADDING и CELLSPACING - добавляют свободное пространство между данными внутри ячейки и ее границами и, соответственно, между ячейками внутри всей таблицы. Если рамка отсутствует, то результат их действия одинаков.

Использование цветов

Тэги < TABLE>, < TD>, < TH> и < TR> допускают использование атрибутов BGCOLOR и BORDERCOLOR для изменения цвета отдельных ячеек или всей таблицы.






© 2023 :: MyLektsii.ru :: Мои Лекции
Все материалы представленные на сайте исключительно с целью ознакомления читателями и не преследуют коммерческих целей или нарушение авторских прав.
Копирование текстов разрешено только с указанием индексируемой ссылки на источник.