Главная страница   /   6.5. Элементы документа и метаданных (Руководство по HTML5

Руководство по HTML5

Руководство по HTML5

Адам Фриман

6.5. Элементы документа и метаданных

В таблице 6-2 приведены элементы документа и метаданных, которые подробно описаны в главе 7. Эти элементы используются для создания надстройки HTML документа, они предоставляют информацию о документе браузеру, определяют скрипты и CSS стили, а также содержание, которое будет отображаться, если скрипты отключены в браузере.

Таблица 6-2: Элементы документа и метаданных
Элемент Описание Тип Новый/Измененный
base Устанавливает базу для относительных URL-адресов метаданные не изменен
body Обозначает содержание в HTML документе N/A (недоступно) изменен
DOCTYPE Обозначает начало HTML документа N/A изменен
head Содержит метаданные документа N/A Не изменен
html Указывает начало самого HTML в документе N/A изменен
link Определяет связь с внешним ресурсом, как правило, таблицей стилей или значком метаданные изменен
meta Содержит сведения о документе метаданные изменен
noscript Содержит контент, который будет отображаться, если скрипты отключены или недоступны в браузере метаданные/фразовый Не изменен
script Определяет блок скрипта, либо встроенный, либо во внешнем файле метаданные/фразовый изменен
style Определяет стиль CSS метаданные изменен
title Устанавливает заголовок документа метаданные Не изменен

Текстовые элементы

Текстовые элементы применяются к содержанию для придания им базовой структуры и смысла. В таблице 6-3 представлены эти элементы, более подробно они описаны в главе 8.

Таблица 6-3: Текстовые элементы
Элемент Описание Тип Новый/Измененный
a Создает гиперссылку фразовый/потоковый Изменен
abbr Обозначает аббревиатуру фразовый не изменен
b Выделяет отрывок текста без дополнительного акцента или важности фразовый изменен
br Обозначает разрыв строки фразовый Не изменен
cite Обозначает название другой работы фразовый изменен
code Обозначает фрагмент программного кода фразовый Не изменен
del Обозначает текст, который был удален из документа фразовый/потоковый новый
dfn Обозначает определение термина фразовый Не изменен
em Обозначает отрывок текста с выразительным акцентом фразовый Не изменен
i Обозначает отрывок текста, который имеет иную природу, чем окружающий контент, например, слово из другого языка фразовый изменен
ins Обозначает текст, который был добавлен в документ фразовый/потоковый новый
kbd Обозначает данные, введенные пользователем фразовый Не изменен
mark Означает содержание, которое будет выделено из-за своей актуальности в другом контексте фразовый новый
q Обозначает содержание, цитируемое из другого источника фразовый Не изменен
rp Обозначает параметры для использования с элементом ruby фразовый новый
rt Обозначает примечание для использования с элементом ruby фразовый новый
ruby Обозначает заметку, которая должна быть размещена выше или справа от символов в логографическом языке фразовый новый
s Обозначает текст, который больше не является правильным фразовый изменен
samp Обозначает выходные данные из компьютерной программы фразовый Не изменен
small Обозначает мелкий шрифт фразовый изменен
span Общий элемент, который не имеет сам по себе семантического значения. Используйте этот элемент, чтобы применять глобальные атрибуты без придания дополнительного семантического значения. фразовый Не изменен
strong Обозначает текст, который является важным фразовый Не изменен
sub Обозначает подстрочный текст фразовый Не изменен
sup Обозначает надстрочный текст фразовый Не изменен
time Обозначает время или дату фразовый новый
u Выделяет отрывок текста без дополнительного акцента или важности фразовый изменен
var Обозначает переменную из программы или компьютерной системы фразовый Не изменен
wbr Указывает место, где может быть безопасно помещен разрыв строки фразовый новый

Объединение содержания

Элементы из таблицы 6-4 используются для группирования и объединения связанного содержания. Полную информацию об этих элементах можно найти в главе 9.

Таблица 6-4: Группирующие элементы
Элемент Описание Тип Новый/Измененный
blockquote Обозначает блок содержания, цитируемый из другого источника Потоковый Не изменен
dd Обозначает определение внутри элемента dl N/A Не изменен
div Общий элемент, который не имеет никакого предопределенного семантического значения. Это потоковый эквивалент элемента span. Потоковый Не изменен
dl Обозначает список, который содержит ряд терминов и определений Потоковый Не изменен
dt Обозначает термин внутри элемента dl N/A Не изменен
figcaption Обозначает заголовок для элемента figure N/A Новый
figure Обозначает изображение Потоковый Новый
hr Обозначает тематический разрыв на уровне абзаца Потоковый Изменен
li Обозначает пункт (единицу, элемент) в элементах ul, ol или menu N/A Изменен
ol Обозначает упорядоченный список элементов Потоковый Изменен
p Обозначает абзац Потоковый Изменен
pre Означает содержание, форматирование которого должно быть сохранено Потоковый Не изменен
ul Обозначает неупорядоченный список элементов Потоковый Изменен

Структурирование содержания

Элементы из таблицы 6-5 используются для того, чтобы разделить содержание таким образом, чтобы каждая концепция, идея или тема были изолированы. Многие из этих элементов являются новыми, и они во многом дают основу для разделения смысла элементов и их внешнего вида. Вы можете узнать больше об этих элементах в главе 10.

Таблица 6-5: Элементы структуры
Элемент Описание Тип Новый/Измененный
address Обозначает контактную информацию для документа или элемента article Потоковый Новый
article Обозначает независимый блок содержания Потоковый Новый
aside Обозначает содержание, которое имеет косвенное отношение к окружающему контенту Потоковый Новый
details Создает раздел, который пользователь может открыть, чтобы получить дополнительную информацию Потоковый Новый
footer Обозначает область нижнего колонтитула Потоковый Новый
h1-h6 Обозначает заголовок Потоковый Не изменен
header Обозначает область заголовка Потоковый Новый
hgroup Скрывает все, кроме первого набора заголовков, в структуре документа Потоковый Новый
nav Указывает на значительную концентрацию элементов навигации Потоковый Новый
section Указывает на важные понятия или темы Потоковый Новый
summary Обозначает название или описание содержания в окружающем элементе details N/A Новый

Создание таблиц

Элементы в таблице 6-6 используются для создания таблиц для отображения данных в сетке. Основное изменение в HTML5 заключается в том, что вы больше не можете использовать таблицы для управления макетом страницы. Вместо этого вы должны использовать возможности CSS таблиц, которые я описал в главе 21.

Таблица 6-6: Элементы таблицы
Элемент Описание Тип Новый/Измененный
caption Добавляет таблице название N/A изменен
col Обозначает одну колонку (столбец) N/A изменен
colgroup Обозначает группу столбцов N/A изменен
table Обозначает таблицу Потоковый изменен
tbody Обозначает тело таблицы N/A изменен
td Обозначает отдельную ячейку таблицы N/A изменен
tfoot Обозначает нижний колонтитул таблицы N/A изменен
th Обозначает отдельную ячейку заголовка N/A изменен
thead Обозначает заголовок таблицы N/A изменен
tr Обозначает ряд ячеек таблицы N/A изменен

Создание форм

Элементы из таблицы 6-7 применяются для создания HTML форм, которые можно использовать для запроса вводимых данных от пользователя. Этой области HTML уделяется большое внимание в HTML5, и она имеет много новых элементов и функций, включая возможность валидации данных, введенных клиентом, прежде чем пользователь сможет отправить форму. Я описываю элементы HTML формы в главах 12, 13 и 14. Особый интерес представляют собой новые виды элемента input, о котором речь идет в главе 12 и который более подробно рассмотрен в главе 13.

Таблица 6-7: Элементы формы
Элемент Описание Тип Новый/Измененный
button Обозначает кнопку, которая будет отправлять или сбрасывать форму (или которая может быть использована в качестве общей кнопки) фразовый изменен
datalist Определяет набор предложенных значений для пользователя потоковый изменен
fieldset Обозначает группу элементов формы потоковый изменен
form Обозначает HTML форму потоковый изменен
input Обозначает управление сбором данных от пользователя фразовый изменен
keygen Создает пару ключей открытый/закрытый (public/private) фразовый новый
label Обозначает метку для элемента формы фразовый изменен
legend Обозначает описательную метку для элемента fieldset N/A не изменен
optgroup Обозначает группу связанных элементов option N/A не изменен
option Обозначает опцию, которая будет представлена пользователю N/A не изменен
output Обозначает результат вычисления фразовый новый
select Представляет пользователю фиксированный набор опций фразовый изменен
textarea Позволяет пользователю ввести несколько строк текста фразовый изменен

Заполнение содержанием

Элементы из таблицы 6-8 используются для внедрения и вставки какого-либо содержания в HTML документ. Некоторые из этих элементов описаны в главе 15, а другие рассматриваются в последующих частях этой книги.

Таблица 6-8: Элементы для внедрения содержания
Элемент Описание Тип Новый/Измененный
area Обозначает место для изображения карты со стороны клиента фразовый изменен
audio Обозначает аудио ресурс N/A новый
canvas Предлагает динамическое графическое полотно фразовый/потоковый новый
embed Внедряет содержание в HTML документ при помощи плагина фразовый новый
iframe Внедряет один документ во второй, создавая просматриваемый контекст фразовый изменен
img Вставляет изображение фразовый изменен
map Обозначает определение клиентской карты-изображения фразовый/потоковый изменен
meter Вставляет представление числовых значений, отображенных в диапазоне возможных значений фразовый новый
object Внедряет содержание в HTML документ, а также может быть использован для создания просматриваемого контекста и создания клиентской карты-изображения фразовый/потоковый изменен
param Обозначает параметр, который будет передан плагину через элемент object N/A не изменен
progress Внедряет представление о прогрессе по отношению к цели или выполнению задачи фразовый новый
source Обозначает медиа ресурс N/A новый
svg Обозначает структурированный векторный контент N/A новый
track Обозначает дополнительный медиа трек, такой как субтитры N/A новый
video Обозначает видео ресурс N/A новый