- •2. Создание статического содержания. Html
- •2.1.3.1. Document Type Definition (dtd)
- •2.1.3.2. Заголовок документа
- •2.1.3.2.1. Метатеги
- •2.1.3.2.2. Заголовок страницы
- •2.1.3.2.3. Link
- •2.1.3.2.4. Script
- •2.1.3.3. Тело документа
- •2.1.3.3.1. Div
- •2.1.3.3.2. Таблица
- •2.1.3.3.3. Заголовки
- •2.1.3.3.4. Ссылки
- •2.1.3.3.5. Списки
- •2.1.3.3.6. Абзацы
- •2.1.3.3.7. Изображения
- •2.1.3.3.8. Другие элементы
- •2.1.4. Другие элементы языка html
- •2.1.5. Xhtml
- •2.1.6. Ключевые термины
- •2.2. Краткие итоги
2.1.3.3. Тело документа
Тело документа <BODY> предназначено для отображения данных на веб-странице, в частности, в теле размещается текст, изображения, ссылки, таблицы, списки и т.д.
В примере тело документа открывается на строке 16 и закрывается на строке 72.
2.1.3.3.1. Div
На строке 17 (и еще в нескольких местах) находится тег <DIV>.
Элемент <DIV> является блочным элементом и предназначен для выделения фрагмента документа с целью изменения вида содержимого [16]. Как правило, вид блока управляется с помощью стилей CSS.
Cодержимое тега <DIV> всегда начинается с новой строки. После него также добавляется перенос строки.
Параметры [2,16]:
align –задает выравнивание содержимого тега <DIV>. Аргументы:
center – выравнивание текста по центру;
left (значение по умолчанию) – выравнивание текста по левому краю;
right – выравнивание текста по правому краю;
justify – выравнивание по ширине, что означает одновременное выравнивание по левому и правому краю.
title – добавляет поясняющий текст к контейнеру <DIV> в виде всплывающей подсказки, которая отображается, когда курсор мыши задерживается на содержимом. В качестве аргумента принимает любую текстовую строку. Строка должна заключаться в двойные или одинарные кавычки.
2.1.3.3.2. Таблица
На строке 21 находится тег <TABLE>.
Для добавления таблицы на веб-страницу используется тег-контейнер <TABLE> [17]. Таблица состоит из строк и столбцов ячеек, которые могут содержать текст и рисунки. Обычно таблицы используются для упорядочения и представления данных, однако возможности таблиц этим не ограничиваются. C помощью таблиц удобно верстать макеты страниц, расположив нужным образом фрагменты текста и изображений.
Для добавления строк используется тег <TR>. Чтобы разделить строки на колонки применяются теги <TD> и <TH>. Разница между этими тегами следующая. Тег <TH> предназначен для создания заголовков, содержимое такой ячейки обозначается жирным начертанием и выравнивается по центру. В остальном, действуют эти теги одинаково.
У каждого параметра таблицы есть свое значение, установленное по умолчанию. Это означает, что если какой-то атрибут пропущен, то неявно он все равно присутствует, причем с некоторым значением. Из-за чего вид таблицы может оказаться совсем другим, нежели предполагал разработчик.
Чтобы понимать, что можно ожидать от таблиц, следует знать их явные и неявные особенности, которые перечислены далее:
одну таблицу допускается помещать внутрь ячейки другой таблицы;
размеры таблицы изначально не установлены и вычисляются на основе содержимого ячеек;
если для таблицы задана ее ширина в процентах или пикселах, то содержимое таблицы подстраивается под указанные размеры;
если ширину содержимого ячейки невозможно изменить, то ширина таблицы увеличивается, несмотря на указанные размеры;
пока таблица не загрузится полностью, ее содержимое не начнет отображаться;
таблица, если не указано особо, всегда выравнивается по левому краю;
по умолчанию таблица выводится без рамки;
Для изменения вида и свойств таблицы используется множество параметров, которые добавляются в теге <TABLE>. Описание параметров таблицы и их значений приведено в табл. 2.2.
|
Таблица 2.2. Параметры тега <table> | ||
|
Свойство |
Значение |
Описание |
|
align |
left right center |
Выравнивание таблицы. |
|
background |
Гиперссылка |
Определяет изображение, которое будет использоваться в качестве фонового рисунка таблицы. |
|
bgcolor |
Код или название цвета |
Цвет фона таблицы. |
|
border |
Число |
Толщина рамки в пикселах. |
|
cellpadding |
Число |
Расстояние между ячейкой и ее содержимым. |
|
cellspacing |
Число |
Дистанция между ячейками. |
|
cols |
Число |
Задает количество столбцов в таблице, помогая браузеру в подготовке к ее отображению. |
|
nowrap |
|
Запрещает переносы строк в тексте. |
|
frame |
void above below lhs rhs hsides vsides box |
Задание типа рамки таблицы |
|
rules |
all groups cols none rows |
Определяет, где рисовать границы между ячейками. |
|
width |
Число или проценты |
Минимальная ширина таблицы, можно задавать в пикселах или процентах. |