Таблицы

Читайте также:

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

Основные тэги, описывающие таблицу <TABLE>...</TABLE>. Все элементы таблицы должны находиться внутри этих двух тэгов. По умолчанию таблица не имеет обрамления и разделителей.

Метка <TABLE> может включать дополнительные атрибуты:

· ALIGN – устанавливает расположение таблицы по отношению к полям документа. Может принимать значения left (слева), right (справа) или center (по центру).

· BORDER – устанавливает ширину внешней рамки таблицы и ячеек в пикселях (например, BORDER=3). Если данный атрибут присутствует, граница таблицы прорисовывается для всех ячеек и для таблицы в целом. Если атрибут не установлен, таблица показывается без рамки.

Тэг <CAPTION> … </CAPTION> описывает название таблицы. Тэг <CAPTION> должен присутствовать внутри меток <TABLE> и </TABLE>, но снаружи описания какой-либо строки или ячейки. Метка <CAPTION> может включать атрибут ALIGN. По умолчанию <CAPTION ALIGN=top > (заголовок помещается над таблицей), но может быть явно установлен <CAPTION ALIGN=bottom > (заголовок помещается под таблицей). Подпись всегда центрирована в рамках ширины таблицы.

Строки таблицы задаются парой меток <TR> и </TR>. Количество строк таблицы определяется количеством встречающихся пар тэгов <TR>..</TR>. Тег строки может иметь атрибуты, которые описывают визуальное положение содержимого строки:

· ALIGN – управляет положением данных в ячейках строки по горизонтали: left (выравнивание влево), right (вправо) или center (по центру).

· VALIGN – устанавливает вертикальное выравнивание текста в ячейках строки:: top (по верхнему краю), middle (по центру), bottom (по нижнему краю).

Каждая ячейка таблицы начинается с метки <TD> и заканчивается меткой </TD>. Ячейка таблицы может быть описана только внутри строки таблицы. Расположение данных в ячейке по умолчанию определяется атрибутами ALIGN=left и VALIGN=middle. Данное расположение может быть исправлено как на уровне описания строки, так и на уровне описания ячейки. Основные атрибуты ячейки таблицы:

· ALIGN – устанавливает выравнивание текста в ячейке. left, right или center.

· VALIGN – определяет вертикальное размещение данных в ячейке. top, bottom, middle и baseline (данные во всех ячейках строки прижаты кверху).

· COLSPAN – указывает, какое количество ячеек будет объединено по горизонтали для указанной ячейки (например, COLSPAN=3). По умолчанию =1.

· ROWSPAN - у казывает, какое количество ячеек будет объединено по вертикали для указанной ячейки. По умолчанию количество =1.

Если ячейка должна содержать заголовок столбца или строки применяют тэг <TH>.

В качестве примера рассмотрим создание нестандартной таблицы:

<CAPTION ALIGN=bottom> Таблица 1 </CAPTION>

<TH COLSPAN=2> Среднее значение </TH> </TR>

<TR> <TD> Мужчины </TD> <TD ALIGN=center> 174 </TD>

<TR> <TD> Женщины </TD> <TD ALIGN=center> 165 </TD>

</TABLE>

В результате получим изображение следующей таблицы:

	Среднее значение
Рост	Вес
Мужчины
Женщины
Таблица 1

Внимание! Закрывающие тэги </TR>, </TH>, </TD> можно опускать.

Контрольные вопросы

1) Объясни понятия HTML, browser, tag. Какова область действия парного и непарного тэгов?

2) Для чего предназначены тэги <HTML>, <HEAD>, <TITLE>, <BODY>?

3) В чем состоит отличие заголовков разных уровней и как их задать? Какую дополнительную информацию несет в себе атрибут ALIGN в теге <H>?

4) Для чего предназначен тег <P>? Какую дополнительную информацию несет в себе атрибут ALIGN в теге <P>?

5) Какую функцию выполняет тег <PRE>? Какой тэг нужно использовать для осуществления перехода на новую строку?

6) С помощью какого тэга можно разделить текст горизонтальной чертой? Объясни назначение атрибутов SIZE, WIDTH, ALIGN, NOSHADE тега <HR>.

7) Опишите тег для создания нумерованного списка и его элементов. Какие атрибуты может иметь тег <OL>?

8) Опишите тег для создания ненумерованного списка и его элементов. Какие атрибуты может иметь тег <UL>?

9) Как создать вложенный список? Какие атрибуты может иметь тег <LI>?

10) С помощью каких тегов можно создать список определений? Опишите тэг для задания параметров шрифта и его атрибуты.

11) Опишите основные и дополнительные теги для задания стилей шрифта.

12) Какой тег позволяет создать гипертекстовую ссылку? Опишите атрибуты тега <A>. Как создать ссылку для перехода между документами, расположенными в одном каталоге, и документами, расположенными в разных каталогах?

13) Как создать ссылку для перехода внутри одного документа?

14) Какой тег позволит вставить в HTML-документ изображение? Опишите обязательный атрибут тега <IMG>? Какие дополнительные атрибуты он может иметь?

15) Какие атрибуты может иметь тег <BODY>для задания цвета фона, текста и ссылок?

16) С помощью какого тега можно вставить в HTML-документ таблицу? Какие атрибуты может иметь тег <TABLE>? Опишите тег для задания заголовка таблицы и его атрибуты.

17) Какие теги предназначены для описания строк и столбцов таблицы? Какие атрибуты может иметь тег <TR> и тэг <TD>?

Дата добавления: 2015-10-02; просмотров: 73 | Нарушение авторских прав

<== предыдущая страница	\|	следующая страница ==>
Стили шрифтов	\|	Структура HTML документа

mybiblioteka.su - 2015-2024 год. (0.009 сек.)