belarusweb.net
© Петр Романовский Минск, 2016-2017.



belarusweb.net

Основы создания сайтов...

HTML >>>

Справочник по HTML

По алфавиту:

A B C D E F H I K L M N O P Q S T U V W

По разделам:

Структура Служебные Объекты Формы Текст Форматирование Списки Таблицы Графика

html-элементы по алфавиту
Элемент Атрибуты Описание
<!– –   – –> Отсутствуют Вложенные комментарии вида <!-- текст1<!-- текст2 -->текст3 --> не поддерживаются. Внутри элемента 'title' комментарии считаются обычным текстом. На странице комментарии не отображаются.  W3C
<!DOCTYPE> Отсутствуют Сообщает браузеру о типе текущего документа. Для HTML 5 и выше используется запись <!DOCTYPE html>.   W3C
<a>
...
</a>
globals     events
href="адресный путь"
target="_self|_blank|_parent|_top"
download  
rel hreflang type
Гиперссылки можно также использовать для создания якоря в виде
<a id="anchor">...</a>. Атрибут target указывает целевое окно, а наличие атрибута download браузер не совершит переход по ссылке, а предложит закачать файл, указанный в атрибуте href в качестве значения.   W3C
<abbr>
...
</abbr>
globals     events Предназначен для выделения аббревиатур и обычно используется с атрибутом title, содержащим расшифровку аббревиатуры; текст данного элемента браузерами никак не выделяется, сохраняя исходное форматирование.   W3C
<address>
...
</address>
globals     events Предназначен для выделения информации об авторе, например, ссылка на его ресурс, адрес и т.д., и отображает свое содержимое курсивом. Браузеры отображают его как блочный элемент.   W3C
<area> globals     events
shape="форма области"
coords="координаты области"
alt="альтер. текст"
href   target   download
rel   hreflang   type
Используется для создания зон-гиперссылок на изображении при формировании карты-изображения.   W3C
<article>
...
</article>
globals     events Элемент структурной разметки документа, определяющий место на странице для информации вроде новости, статьи, записи блога, сообщения на форуме и т.д.   W3C
<aside>
...
</aside>
globals     events Устанавливает боковую панель ('сайдбар') веб-страницы, предназначенную для размещения сопутствующей, дополнительной информации, которую можно удалить без ущерба для понимания основного содержимого всей страницы или раздела, но в тоже время косвенно связанной с этим содержимым.   W3C
<audio>
...
</audio>
globals     events
preload="none | auto | metadata"
autoplay   loop   muted   controls
Добавляет аудиозапись на страницу, а также позволяет воспроизводить и управлять ею. Атрибуты без значений по умолчанию выключены. Атрибут autoplay отменяет действие атрибута preload.   W3C
<b>
...
</b>
globals     events Отображает свое содержимое полужирным шрифтом. В HTML 5 он обозначает стилистическое усиление своего содержимого, например, ключевых слов, которые выделяются в типографике полужирным начертанием.   W3C
<base> globals     events                    
href="адресный путь"
target="_self|_blank|_parent|_top"
Сообщает браузеру базовый адрес текущего документа. Атрибут target затем можно переопределять у каждого конкретного элемента.   W3C
<blockquote>
...
</blockquote>
globals     events Предназначен для выделения длинных цитат, в отличие от элемента 'q', при помощи которого выделяются небольшие цитаты. Браузеры отображают его как блочный элемент.   W3C
<body>
...
</body>
globals     events Тело документа располагают сразу после заголовка документа. В него помещают всю информацию, которую необходимо вывести на экран, а также теги, отвечающие за форматирование этой информации.   W3C
<br> globals     events Принудительный перенос строки (разрыв строки).   W3C
<button>
...
</button>
globals     events
type="button | reset | submit"
name="имя элемента"
value="значение"
form="значение id формы"
formaction="путь к обработчику"
formenctype="кодировка данных"
formmethod="GET | POST"
formtarget="целевое окно" formnovalidate
autofocus   disabled
Используется для создания кнопок. В отличие от элемента 'input' с аналогичными значениями атрибута type не является пустым элементом и позволяет размещать внутри себя другие элементы, например, изображения, которые потом становятся одной активной кнопкой.   W3C
<canvas>
...
</canvas>
globals     events                    
height="число"
width="число"
Создает область, в которой при помощи скриптов, в основном JavaScript, можно не только выводить изображения, но и рисовать их, трансформировать, менять свойства.   W3C
<caption>
...
</caption>
globals     events Используется для создания заголовка к таблице. По умолчанию браузеры выравнивают его по центру.   W3C
<cite>
...
</cite>
globals     events Предназначен для выделения сносок на другой материал и отображает свое содержимое курсивом.   W3C
<code>
...
</code>
globals     events Предназначен для выделения текста программного кода и отображает свое содержимое моноширинным шрифтом.   W3C
<col> globals     events
span="натур. число"
Используется для объединения колонок по общему признаку и располагается сразу же после элемента 'caption'.   W3C
<colgroup>
...
</colgroup>
globals     events
span="натур. число"
Используется для объединения колонок по общему признаку и располагается сразу же после элемента 'caption'. Может использоваться как контейнер для элементов 'col'.   W3C
<datalist>
...
</datalist>
globals     events                    
Данный элемент создает список вариантов, которые можно выбирать при вводе текста, т.е. используется для автозаполнения. Элемент имеет только глобальные атрибуты, а используется совместно с элементом 'input', у которого имеется для этого атрибут list, принимающий в качестве значения 'id' элемента 'datalist'.   W3C
<dd>
...
</dd>
globals     events Создает описание термина в списке определений 'dl'.   W3C
<del>
...
</del>
globals     events Предназначен для выделения текста, который был удален в новой версии документа, и отображает свое содержимое зачеркнутым.   W3C
<dfn>
...
</dfn>
globals     events Предназначен для выделения терминов, которые встречаются в тексте впервые, и отображает свое содержимое курсивом.   W3C
<div>
...
</div>
globals     events Элемент 'div' является универсальным блочным элементом. Поэтому он применяется для изменения внешнего вида целых блоков веб-документа, для которых применение тегов с каким-то логическим смыслом нецелесообразно.   W3C
<dl>
...
</dl>
globals     events Список определений.   W3C
<dt>
...
</dt>
globals     events Создает термин в списке определений 'dl'.   W3C
<em>
...
</em>
globals     events Предназначен для акцентирования текста (обращает внимание на его важность) и отображает свое содержимое курсивом.   W3C
<embed>
...
</embed>
globals     events
src="путь к файлу"
type="mime-тип данных"
width="число"   height="число"
Используется для вставки в документ и отображения объектов, которые браузер не понимает изначально.   W3C
<fieldset>
...
</fieldset>
globals     events                    
form="значение id формы"
name="имя"   disabled
Используется в качестве контейнера для объединения элементов в группы по каким-либо признакам, например, текстовые поля можно отделить от полей ввода логина и пароля, а также флажков.   W3C
<footer>
...
</footer>
globals     events Задаёт 'подвал' сайта или раздела. Используется для размещения сведений об авторских правах, контактной информации, даты последнего обновления документа или раздела, дополнительной навигации и прочей информации, относящейся к служебной информации всего сайта, а не к основному контенту страницы или раздела.   W3C
<form>
...
</form>
globals     events
name="имя формы"
action="путь к обработчику"
method="GET | POST"
enctype="кодировка данных"
target="целевое окно"
autocomplete="on | off"  
novalidate
accept-charset="код-ка символов"
Формы используются для обмена данными между компьютером пользователя и сервером. Данные форм по умолчанию передаются методом GET, поэтому нужно самим указывать значение POST. Атрибут enctype можно не указывать, т.к. его значение "application/x-www-form-urlencoded" подходит для большинства случаев, но при загрузке файлов нужно указывать значение "multipart/form-data". Если атрибут accept-charset не указан, то указывается кодировка, установленная для страницы, т.е. скорее всего 'utf-8'.   W3C
<h1>
...
</h6>
globals     events Создание заголовков разных уровней от 'h1' до 'h6'.   W3C
<head>
...
</head>
globals     events Заголовок документа располагается после открывающего тега <html> и предназначен для хранения служебных тегов с метаданными, которые сообщают браузеру информацию, необходимую для работы с данными страницы.   W3C
<header>
...
</header>
globals     events Устанавливает заголовок ('шапку') веб-страницы или раздела. Если он выступает в роли 'шапки' сайта, то в нем обычно располагаются имя сайта, логотип, меню, поисковая панель или дополнительная информация. Кроме того, он может формировать заголовки разделов html-страницы. Внутри данного элемента запрещается располагать элементы 'footer', 'address' или другие элементы 'header'.   W3C
<hr> globals     events Рисует горизонтальную линию.   W3C
<html>
...
</html>
globals     events Контейнер 'html' вмещает все остальное содержимое веб-страницы.   W3C
<i>
...
</i>
globals     events                    
Отображает свое содержимое курсивом. В HTML 5 он обозначает дополнительное выделение своего содержимого, например, иностранных слов, технических терминов, вставок рукописного текста, короче того, что выделяется курсивом в типографике.   W3C
<iframe>
...
</iframe>
globals     events
name="имя фрейма"
src="путь к файлу"
width="число"   height="число"
sandbox="ограничения на контент"
srcdoc="код документа"
Создает в документе прямоугольную область, в которую по умолчанию загружается внешний независимый документ. При одновременном использовании атрибутов srcdoc и src, последний игнорируется.   W3C
<img> globals     events
src="путь к файлу"
alt="альтерн. текст"
height="число"
width="число"
ismap
usemap="имя эл-та map"
Используется для вставки изображения в документ.   W3C
<input> globals     events
type="тип элемента"
name="имя элемента"
value="значение элемента"
form="значение id формы"
autocomplete="on | off"
checked   autofocus   disabled
multiple   readonly   required
placeholder="текст-подсказка"
maxlength="натур. число"
minlength="натур. число"
size="число символов"
src="путь к изображению"
height="число"   width="число"
alt="альтерн. текст"
list="id эл-та datalist"
accept="MIME-тип файла"
formnovalidate
formaction="путь к обработчику"
formenctype="кодировка данных"
formmethod="GET | POST"
formtarget="целевое окно"
Универсальный элемент, который применяется как для создания текстовых полей, так и различных кнопок, переключателей, скрытых полей и т.д. Если для элемента 'form' указаны атрибуты novalidate, action, enctype, method, target и др., то соответствующие атрибуты элементов формы в случае применения переопределяют их. Полный список атрибутов можно посмотреть на официальном сайте. Те из них, которые на данный момент поддерживаются не всеми браузерами, здесь не указаны.   W3C
<ins>
...
</ins>
globals     events Предназначен для выделения текста, который был добавлен в новую версию документа, и отображает свое содержимое подчеркнутым.   W3C
<kbd>
...
</kbd>
globals     events                    
Предназначен для выделения текста, который должен быть введен с клавиатуры или используется для названия клавиш клавиатуры, и отображает свое содержимое моноширинным шрифтом.   W3C
<label>
...
</label>
globals     events
for="id элемента формы"
Устанавливает связь между текстом и элементом формы, расположенными внутри данного элемента. Если используется атрибут for, то элемент формы может находиться в нужном месте и вне элемента 'label'.   W3C
<legend>
...
</legend>
globals     events
Используется для создания заголовка группы элементов формы, объединенной при помощи элемента 'fieldset'. Текст, написанный внутри элемента 'legend', как раз и становится заголовком, который отображается вверху и встраивается в рамку, которой ограничивается объединенная группа элементов.   W3C
<link> globals     events
href="адресный путь"
rel="stylesheet | тип данных"
media="all | тип устройства"
type, hreflang, sizes, crossorigin
Устанавливает связь с внешними файлами, содержащими, например, необходимые стили CSS или другие данные, и подключает их к документу. Для подключаемых css-таблиц применяется type="text/css". Атрибут media может принимать значения "all | braille | handheld | print | screen | speech | projection| tty | tv".   W3C
<li>
...
</li>
globals     events Пункты нумерованных и маркированных списков, которые располагаются друг за другом.   W3C
<map>
...
</map>
globals     events
name="имя карты"
Используется для создания карты-изображения вместе с элементами 'area'.   W3C
<meta> globals     events
charset="кодировка"
name="имя для content"
content="значение пары"
http-equiv="имя http-заголовка"
Формирует пустой элемент разметки 'meta', который используется для хранения метаданных.   W3C
<nav>
...
</nav>
globals     events Применяется для создания блока навигации, ссылки которого могут указывать как на разделы самого сайта, так и на внешние ресурсы. Рекомендуется использовать именно в качестве основного меню сайта. Размещать его можно в любом месте тела документа, за исключением элемента 'address'.   W3C
<ol>
...
</ol>
globals     events                    
start="целое число"
reversed
Нумерованный список. Атрибут start задает число, с которого будет начинаться нумерованный список.   W3C
<option>
...
</option>
globals     events
value="значение пункта"
label="текст"
disable   selected
Располагается внутри списка вариантов 'select' и создает один пункт этого списка.   W3C
<optgroup>
...
</optgroup>
globals     events
disable
label="заголовок группы"
Используется в качестве контейнера для группировки выбранных пунктов 'option' раскрывающегося списка 'select'.   W3C
<p>
...
</p>
globals     events Используется для разбиения текста на абзацы.   W3C
<pre>
...
</pre>
globals     events Преформатированный текст.   W3C
<q>
...
</q>
globals     events Предназначен для выделения в тексте небольших цитат и отображает свое содержимое в кавычках.   W3C
<s>
...
</s>
globals     events                    
Содержимое элемента отображается зачеркнутым. В HTML 5 он используется для текста, который потерял свою актуальность, например, для старой цены продукта.   W3C
<samp>
...
</samp>
globals     events Предназначен для выделения текста, который является результатом вывода компьютерной программы, и отображает свое содержимое моноширинным шрифтом.   W3C
<script>
...
</script>
globals     events
src="путь к файлу"  
type="text/javascript | text/vbscript"
defer   async
Cлужит для подключения либо описания программных скриптов внутри исходного кода html. По умолчанию скрипты выполняются последовательно согласно их появлению в коде. Атрибуты defer и async не принимают значения, по умолчанию выключены, работают только, если указан атрибут src. Если указаны оба атрибута, то предпочтение отдается defer.   W3C
<section>
...
</section>
globals     events
Данный элемент должен применяться для явного разделения страницы на разделы, чтобы они различались по содержанию и смыслу. Разрешается использовать одни элементы 'section' внутри других.   W3C
<select>
...
</select>
globals     events
size="натур. число"   multiple
form="значение id формы"
name="имя элемента"
autofocus   disabled   required
Используется для создания раскрывающихся списков с выбором предопределенных варинтов.   W3C
<small>
...
</small>
globals     events Предназначен для выделения текста, который можно отнести к надписям мелким шрифтом или пометкам, как, например, второстепенная информация в конце юридических документов об отказе от ответственности или же информации о лицензии; элемент отображает свое содержимое моноширинным шрифтом.   W3C
<source> globals     events
src="путь к файлу"
media="all | тип устройства"
type="MIME-тип; codecs='кодек'"
Используется для указания пути к медиафайлам и вставляемому контенту. Посмотреть примеры значений атрибута type можно на официальном сайте здесь.   W3C
<span>
...
</span>
globals     events Универсальный элемент 'span' в основном применяется для выделения небольших фрагментов текста, рисунков или даже отдельных символов и букв, для которых применение тегов с каким-то логическим смыслом нецелесообразно.   W3C
<strong>
...
</strong>
globals     events Предназначен для еще большего акцентирования текста (делает его еще более важным) и отображает свое содержимое полужирным шрифтом.   W3C
<style>
...
</style>
globals     events
media="all | тип устройства"
type="text/css | mime-тип данных"
Предназначен в основном для хранения внутренних таблиц стилей CSS, которые имеют силу во всем документе. Располагается в заголовке документа. Разрешается использовать несколько элементов 'style'. Атрибут media может принимать значения "all | braille | handheld | print | screen | speech | projection| tty | tv".   W3C
<sub>
...
</sub>
globals     events Элемент отображает свое содержимое в виде нижнего индекса.   W3C
<sup>
...
</sup>
globals     events Элемент отображает свое содержимое в виде верхнего индекса.   W3C
<table>
...
</table>
globals     events                    
Используется для создания таблицы.   W3C
<tbody>
...
</tbody>
globals     events Предназначен для размещения обычных строк с данными, сгруппированных по каким-либо признакам.   W3C
<td>
...
</td>
globals     events
colspan="число гориз. ячеек"
rowspan="число верт. ячеек"
Используется для создания ячейки таблицы.   W3C
<textarea>
...
</textarea>
globals     events
cols="20 | натур. число"
rows="2 | натур. число"
wrap="soft | hard"
form="значение id формы"
name="имя элемента"
placeholder="текст-подсказка"
maxlength="натур. число"
minlength="натур. число"
readonly   required
autofocus   disabled
Текстовое поле используется для ввода многострочного текста, например, при оставлении комментариев или отправки сообщений. В отличие от текстового поля 'input' в элементе 'textarea' допустимо делать переносы строк, которые сохраняются при отправке данных на сервер. Внутри контейнера 'textarea' разрешается писать любой текст, включая конструкции тегов. Этот текст будет отображаться браузером внутри текстового поля и при желании может быть удален пользователем во избежание отправки на сервер вместе с остальными данными.   W3C
<tfoot>
...
</tfoot>
globals     events Предназначен для группирования одной или нескольких строк внизу таблицы.   W3C
<th>
...
</th>
globals     events
colspan="число гориз. ячеек"
rowspan="число верт. ячеек"
Используется для создания заголовочной ячейки таблицы.   W3C
<thead>
...
</thead>
globals     events Предназначен для группирования одной или нескольких строк вверху таблицы.   W3C
<title>
...
</title>
globals     events Предназначен для определения заголовка страницы. Текст, написанный внутри элемента 'title' отображается браузерами в качестве названий вкладок страниц над адресной строкой или возле нее. В пределах одного документа разрешается только один такой элемент.   W3C
<tr>
...
</tr>
globals     events Используется для создания строки таблицы.   W3C
<u>
...
</u>
globals     events                    
Содержимое элемента отображается подчеркнутым. В HTML 5 он в основном используется для стилистического выделения слов с орфографическими ошибками или имен собственных в китайском языке.   W3C
<ul>
...
</ul>
globals     events Маркированный список.   W3C
<var>
...
</var>
globals     events Предназначен для выделения переменных компьютерных программ и отображает свое содержимое курсивом.   W3C
<video>
...
</video>
globals     events
preload="none | auto | metadata"
autoplay   loop   muted   controls
poster   width="число"   height="число"
Добавляет видеозапись на страницу, а также позволяет воспроизводить и управлять ею. Атрибуты без значений по умолчанию выключены. Атрибут autoplay отменяет действие атрибута preload.   W3C
<wbr> globals     events Мягкий перенос строки осуществляет разрыв строки только тогда, когда этого требует ширина родительского элемента. В противном случае перенос строки не происходит. Есть замечание.   W3C
Наверх
Элементы структуры документа
Элемент Атрибуты Описание
<!– –   – –> Отсутствуют Вложенные комментарии вида <!-- текст1<!-- текст2 -->текст3 --> не поддерживаются. Внутри элемента 'title' комментарии считаются обычным текстом. На странице комментарии не отображаются.   W3C
<!DOCTYPE> Отсутствуют Сообщает браузеру о типе текущего документа. Для HTML 5 и выше используется запись <!DOCTYPE html>.   W3C
<aside>
...
</aside>
globals     events Устанавливает боковую панель ('сайдбар') веб-страницы, предназначенную для размещения сопутствующей, дополнительной информации, которую можно удалить без ущерба для понимания основного содержимого всей страницы или раздела, но в тоже время косвенно связанной с этим содержимым.   W3C
<article>
...
</article>
globals     events Элемент структурной разметки документа, определяющий место на странице для информации вроде новости, статьи, записи блога, сообщения на форуме и т.д.   W3C
<body>
...
</body>
globals     events Тело документа располагают сразу после заголовка документа. В него помещают всю информацию, которую необходимо вывести на экран, а также теги, отвечающие за форматирование этой информации.   W3C
<footer>
...
</footer>
globals     events Задаёт 'подвал' сайта или раздела. Используется для размещения сведений об авторских правах, контактной информации, даты последнего обновления документа или раздела, дополнительной навигации и прочей информации, относящейся к служебной информации всего сайта, а не к основному контенту страницы или раздела.   W3C
<head>
...
</head>
globals     events Заголовок документа располагается после открывающего тега <html> и предназначен для хранения служебных тегов с метаданными, которые сообщают браузеру информацию, необходимую для работы с данными страницы.   W3C
<header>
...
</header>
globals     events Устанавливает заголовок ('шапку') веб-страницы или раздела. Если он выступает в роли 'шапки' сайта, то в нем обычно располагаются имя сайта, логотип, меню, поисковая панель или дополнительная информация. Кроме того, он может формировать заголовки разделов html-страницы. Внутри данного элемента запрещается располагать элементы 'footer', 'address' или другие элементы 'header'.   W3C
<html>
...
</html>
globals     events Контейнер 'html' вмещает все остальное содержимое веб-страницы.   W3C
<nav>
...
</nav>
globals     events Применяется для создания блока навигации, ссылки которого могут указывать как на разделы самого сайта, так и на внешние ресурсы. Рекомендуется использовать именно в качестве основного меню сайта. Размещать его можно в любом месте тела документа, за исключением элемента 'address'.   W3C
<section>
...
</section>
globals     events
Данный элемент должен применяться для явного разделения страницы на разделы, чтобы они различались по содержанию и смыслу. Разрешается использовать одни элементы 'section' внутри других.   W3C
Наверх
Служебные элементы
Элемент Атрибуты Описание
<base> globals     events
href="адресный путь"
target="_self|_blank|_parent|_top"
Сообщает браузеру базовый адрес текущего документа. Атрибут target затем можно переопределять у каждого конкретного элемента.   W3C
<link> globals     events
href="адресный путь"
rel="stylesheet | тип данных"
media="all | тип устройства"
type, hreflang, sizes, crossorigin
Устанавливает связь с внешними файлами, содержащими, например, необходимые стили CSS или другие данные, и подключает их к документу. Для подключаемых css-таблиц применяется type="text/css". Атрибут media может принимать значения "all | braille | handheld | print | screen | speech | projection| tty | tv".   W3C
<meta> globals     events
charset="кодировка"
name="имя для content"
content="значение пары"
http-equiv="имя http-заголовка"
Формирует пустой элемент разметки 'meta', который используется для хранения метаданных.   W3C
<script>
...
</script>
globals     events
src="путь к файлу"  
type="text/javascript | text/vbscript"
defer   async
Cлужит для подключения либо описания программных скриптов внутри исходного кода html. По умолчанию скрипты выполняются последовательно согласно их появлению в коде. Атрибуты defer и async не принимают значения, по умолчанию выключены, работают только, если указан атрибут src. Если указаны оба атрибута, то предпочтение отдается defer.   W3C
<style>
...
</style>
globals     events
media="all | тип устройства"
type="text/css | mime-тип данных"
Предназначен в основном для хранения внутренних таблиц стилей CSS, которые имеют силу во всем документе. Располагается в заголовке документа. Разрешается использовать несколько элементов 'style'. Атрибут media может принимать значения "all | braille | handheld | print | screen | speech | projection| tty | tv".   W3C
<title>
...
</title>
globals     events Предназначен для определения заголовка страницы. Текст, написанный внутри элемента 'title' отображается браузерами в качестве названий вкладок страниц над адресной строкой или возле нее. В пределах одного документа разрешается только один такой элемент.   W3C
Наверх
Вставка объектов в документ
Элемент Атрибуты Описание
<audio>
...
</audio>
globals     events
preload="none | auto | metadata"
autoplay   loop   muted   controls
Добавляет аудиозапись на страницу, а также позволяет воспроизводить и управлять ею. Атрибуты без значений по умолчанию выключены. Атрибут autoplay отменяет действие атрибута preload.   W3C
<embed>
...
</embed>
globals     events
src="путь к файлу"
type="mime-тип данных"
width="число"   height="число"
Используется для вставки в документ и отображения объектов, которые браузер не понимает изначально.   W3C
<iframe>
...
</iframe>
globals     events
name="имя фрейма"
src="путь к файлу"
width="число"   height="число"
sandbox="ограничения на контент"
srcdoc="код документа"
Создает в документе прямоугольную область, в которую по умолчанию загружается внешний независимый документ. При одновременном использовании атрибутов srcdoc и src, последний игнорируется.   W3C
<source> globals     events
src="путь к файлу"
media="all | тип устройства"
type="MIME-тип; codecs='кодек'"
Используется для указания пути к медиафайлам и вставляемому контенту. Посмотреть примеры значений атрибута type можно на официальном сайте здесь.   W3C
<video>
...
</video>
globals     events
preload="none | auto | metadata"
autoplay   loop   muted   controls
poster   width="число"   height="число"
Добавляет видеозапись на страницу, а также позволяет воспроизводить и управлять ею. Атрибуты без значений по умолчанию выключены. Атрибут autoplay отменяет действие атрибута preload.   W3C
Наверх
Работа с формами
Элемент Атрибуты Описание
<button>
...
</button>
globals     events
type="button | reset | submit"
name="имя элемента"
value="значение"
form="значение id формы"
formaction="путь к обработчику"
formenctype="кодировка данных"
formmethod="GET | POST"
formtarget="целевое окно"
formnovalidate
autofocus   disabled
Используется для создания кнопок. В отличие от элемента 'input' с аналогичными значениями атрибута type не является пустым элементом и позволяет размещать внутри себя другие элементы, например, изображения, которые потом становятся одной активной кнопкой.   W3C
<datalist>
...
</datalist>
globals     events
Данный элемент создает список вариантов, которые можно выбирать при вводе текста, т.е. используется для автозаполнения. Элемент имеет только глобальные атрибуты, а используется совместно с элементом 'input', у которого имеется для этого атрибут list, принимающий в качестве значения 'id' элемента 'datalist'.   W3C
<fieldset>
...
</fieldset>
globals     events
form="значение id формы"
name="имя"   disabled
Используется в качестве контейнера для объединения элементов в группы по каким-либо признакам, например, текстовые поля можно отделить от полей ввода логина и пароля, а также флажков.   W3C
<form>
...
</form>
globals     events
name="имя формы"
action="путь к обработчику"
method="GET | POST"
enctype="кодировка данных"
target="целевое окно"
autocomplete="on | off"   novalidate
accept-charset="код-ка символов"
Формы используются для обмена данными между компьютером пользователя и сервером. Данные форм по умолчанию передаются методом GET, поэтому нужно самим указывать значение POST. Атрибут enctype можно не указывать, т.к. его значение "application/x-www-form-urlencoded" подходит для большинства случаев, но при загрузке файлов нужно указывать значение "multipart/form-data". Если атрибут accept-charset не указан, то указывается кодировка, установленная для страницы, т.е. скорее всего 'utf-8'.   W3C
<input> globals     events                    
type="тип элемента"
name="имя элемента"
value="значение элемента"
form="значение id формы"
autocomplete="on | off"
checked   autofocus   disabled
multiple   readonly   required
placeholder="текст-подсказка"
maxlength="натур. число"
minlength="натур. число"
size="число символов"
src="путь к изображению"
height="число"   width="число"
alt="альтерн. текст"
list="id эл-та datalist"
accept="MIME-тип файла"
formnovalidate
formaction="путь к обработчику"
formenctype="кодировка данных"
formmethod="GET | POST"
formtarget="целевое окно"
Универсальный элемент, который применяется как для создания текстовых полей, так и различных кнопок, переключателей, скрытых полей и т.д. Если для элемента 'form' указаны атрибуты novalidate, action, enctype, method, target и др., то соответствующие атрибуты элементов формы в случае применения переопределяют их. Полный список атрибутов можно посмотреть на официальном сайте. Те из них, которые на данный момент поддерживаются не всеми браузерами, здесь не указаны.   W3C
<label>
...
</label>
globals     events
for="id элемента формы"
Устанавливает связь между текстом и элементом формы, расположенными внутри данного элемента. Если используется атрибут for, то элемент формы может находиться в нужном месте и вне элемента 'label'.   W3C
<legend>
...
</legend>
globals     events
Используется для создания заголовка группы элементов формы, объединенной при помощи элемента 'fieldset'. Текст, написанный внутри элемента 'legend', как раз и становится заголовком, который отображается вверху и встраивается в рамку, которой ограничивается объединенная группа элементов.   W3C
<option>
...
</option>
globals     events
value="значение пункта"
label="текст"
disable   selected
Располагается внутри списка вариантов 'select' и создает один пункт этого списка.   W3C
<optgroup>
...
</optgroup>
globals     events
disable
label="заголовок группы"
Используется в качестве контейнера для группировки выбранных пунктов 'option' раскрывающегося списка 'select'.   W3C
<select>
...
</select>
globals     events
size="натур. число"   multiple
form="значение id формы"
name="имя элемента"
autofocus   disabled   required
Используется для создания раскрывающихся списков с выбором предопределенных варинтов.   W3C
<textarea>
...
</textarea>
globals     events
cols="20 | натур. число"
rows="2 | натур. число"
wrap="soft | hard"
form="значение id формы"
name="имя элемента"
placeholder="текст-подсказка"
maxlength="натур. число"
minlength="натур. число"
readonly   required
autofocus   disabled
Текстовое поле используется для ввода многострочного текста, например, при оставлении комментариев или отправки сообщений. В отличие от текстового поля 'input' в элементе 'textarea' допустимо делать переносы строк, которые сохраняются при отправке данных на сервер. Внутри контейнера 'textarea' разрешается писать любой текст, включая конструкции тегов. Этот текст будет отображаться браузером внутри текстового поля и при желании может быть удален пользователем во избежание отправки на сервер вместе с остальными данными.   W3C
Наверх
Текстовые элементы
Элемент Атрибуты Описание
<a>
...
</a>
globals     events
href="адресный путь"
target="_self|_blank|_parent|_top"
download   rel hreflang type
Гиперссылки можно также использовать для создания якоря в виде
<a id="anchor">...</a>. Атрибут target указывает целевое окно, а наличие атрибута download браузер не совершит переход по ссылке, а предложит закачать файл, указанный в атрибуте href в качестве значения.   W3C
<abbr>
...
</abbr>
globals     events Предназначен для выделения аббревиатур и обычно используется с атрибутом title, содержащим расшифровку аббревиатуры; текст данного элемента браузерами никак не выделяется, сохраняя исходное форматирование.   W3C
<address>
...
</address>
globals     events Предназначен для выделения информации об авторе, например, ссылка на его ресурс, адрес и т.д., и отображает свое содержимое курсивом. Браузеры отображают его как блочный элемент.   W3C
<b>
...
</b>
globals     events Отображает свое содержимое полужирным шрифтом. В HTML 5 он обозначает стилистическое усиление своего содержимого, например, ключевых слов, которые выделяются в типографике полужирным начертанием.   W3C
<blockquote>
...
</blockquote>
globals     events Предназначен для выделения длинных цитат, в отличие от элемента 'q', при помощи которого выделяются небольшие цитаты. Браузеры отображают его как блочный элемент.   W3C
<cite>
...
</cite>
globals     events Предназначен для выделения сносок на другой материал и отображает свое содержимое курсивом.   W3C
<code>
...
</code>
globals     events Предназначен для выделения текста программного кода и отображает свое содержимое моноширинным шрифтом.   W3C
<del>
...
</del>
globals     events Предназначен для выделения текста, который был удален в новой версии документа, и отображает свое содержимое зачеркнутым.   W3C
<dfn>
...
</dfn>
globals     events Предназначен для выделения терминов, которые встречаются в тексте впервые, и отображает свое содержимое курсивом.   W3C
<em>
...
</em>
globals     events Предназначен для акцентирования текста (обращает внимание на его важность) и отображает свое содержимое курсивом.   W3C
<i>
...
</i>
globals     events Отображает свое содержимое курсивом. В HTML 5 он обозначает дополнительное выделение своего содержимого, например, иностранных слов, технических терминов, вставок рукописного текста, короче того, что выделяется курсивом в типографике.   W3C
<ins>
...
</ins>
globals     events                    
Предназначен для выделения текста, который был добавлен в новую версию документа, и отображает свое содержимое подчеркнутым.   W3C
<kbd>
...
</kbd>
globals     events Предназначен для выделения текста, который должен быть введен с клавиатуры или используется для названия клавиш клавиатуры, и отображает свое содержимое моноширинным шрифтом.   W3C
<q>
...
</q>
globals     events Предназначен для выделения в тексте небольших цитат и отображает свое содержимое в кавычках.   W3C
<s>
...
</s>
globals     events Содержимое элемента отображается зачеркнутым. В HTML 5 он используется для текста, который потерял свою актуальность, например, для старой цены продукта.   W3C
<samp>
...
</samp>
globals     events Предназначен для выделения текста, который является результатом вывода компьютерной программы, и отображает свое содержимое моноширинным шрифтом.   W3C
<small>
...
</small>
globals     events Предназначен для выделения текста, который можно отнести к надписям мелким шрифтом или пометкам, как, например, второстепенная информация в конце юридических документов об отказе от ответственности или же информации о лицензии; элемент отображает свое содержимое моноширинным шрифтом.   W3C
<strong>
...
</strong>
globals     events Предназначен для еще большего акцентирования текста (делает его еще более важным) и отображает свое содержимое полужирным шрифтом.   W3C
<sub>
...
</sub>
globals     events Элемент отображает свое содержимое в виде нижнего индекса.   W3C
<sup>
...
</sup>
globals     events Элемент отображает свое содержимое в виде верхнего индекса.   W3C
<u>
...
</u>
globals     events Содержимое элемента отображается подчеркнутым. В HTML 5 он в основном используется для стилистического выделения слов с орфографическими ошибками или имен собственных в китайском языке.   W3C
<var>
...
</var>
globals     events Предназначен для выделения переменных компьютерных программ и отображает свое содержимое курсивом.   W3C
Наверх
Форматирование документа
Элемент Атрибуты Описание
<br> globals     events Используется для создания принудительного переноса строки (разрыва строки).   W3C
<div>
...
</div>
globals     events Элемент 'div' является универсальным блочным элементом. Поэтому он применяется для изменения внешнего вида целых блоков веб-документа, для которых применение тегов с каким-то логическим смыслом нецелесообразно.   W3C
<h1>
...
</h6>
globals     events Создание заголовков разных уровней от 'h1' до 'h6'.   W3C
<hr> globals     events Рисует горизонтальную линию.   W3C
<p>
...
</p>
globals     events Используется для разбиения текста на абзацы.   W3C
<pre>
...
</pre>
globals     events Преформатированный текст.   W3C
<span>
...
</span>
globals     events Универсальный элемент 'span' в основном применяется для выделения небольших фрагментов текста, рисунков или даже отдельных символов и букв, для которых применение тегов с каким-то логическим смыслом нецелесообразно.   W3C
<wbr> globals     events Мягкий перенос строки осуществляет разрыв строки только тогда, когда этого требует ширина родительского элемента. В противном случае перенос строки не происходит. Есть замечание.   W3C
Наверх
Оформление списков
Элемент Атрибуты Описание
<ol>
...
</ol>
globals     events
start="целое число"
reversed
Используется для создания нумерованного списка. Атрибут start задает число, с которого будет начинаться нумерованный список.   W3C
<li>
...
</li>
globals     events Используется для создания пунктов нумерованных и маркированных списков, которые располагаются друг за другом.   W3C
<ul>
...
</ul>
globals     events Используется для создания маркированного списка.   W3C
<dl>
...
</dl>
globals     events Используется для создания списка определений.   W3C
<dt>
...
</dt>
globals     events Создает термин в списке определений 'dl'.   W3C
<dd>
...
</dd>
globals     events Создает описание термина в списке определений 'dl'.   W3C
Наверх
Создание таблиц
Элемент Атрибуты Описание
<table>
...
</table>
globals     events Используется для создания таблицы.   W3C
<caption>
...
</caption>
globals     events Используется для создания заголовка к таблице. По умолчанию браузеры выравнивают его по центру.   W3C
<tr>
...
</tr>
globals     events Используется для создания строки таблицы.   W3C
<th>
...
</th>
globals     events
colspan="число гориз. ячеек"
rowspan="число верт. ячеек"
Используется для создания заголовочной ячейки таблицы.   W3C
<td>
...
</td>
globals     events
colspan="число гориз. ячеек"
rowspan="число верт. ячеек"
Используется для создания ячейки таблицы.   W3C
<thead>
...
</thead>
globals     events Предназначен для группирования одной или нескольких строк вверху таблицы.   W3C
<tbody>
...
</tbody>
globals     events Предназначен для размещения обычных строк с данными, сгруппированных по каким-либо признакам.   W3C
<tfoot>
...
</tfoot>
globals     events Предназначен для группирования одной или нескольких строк внизу таблицы.   W3C
<col> globals     events
span="натур. число"
Используется для объединения колонок по общему признаку и располагается сразу же после элемента 'caption'.   W3C
<colgroup>
...
</colgroup>
globals     events
span="натур. число"
Используется для объединения колонок по общему признаку и располагается сразу же после элемента 'caption'. Может использоваться как контейнер для элементов 'col'.   W3C
Наверх
Использование графики
Элемент Атрибуты Описание
<img> globals     events
src="путь к файлу"
alt="альтерн. текст"
height="число"
width="число"
ismap
usemap="имя эл-та map"
Используется для вставки изображения в документ.   W3C
<map>
...
</map>
globals     events
name="имя карты"
Используется для создания карты-изображения вместе с элементами 'area'.   W3C
<area> globals     events
shape="форма области"
coords="координаты области"
alt="альтер. текст"
href   target   download
rel   hreflang   type
Используется для создания зон-гиперссылок на изображении при формировании карты-изображения.   W3C
<canvas>
...
</canvas>
globals     events
height="число"
width="число"
Создает область, в которой при помощи скриптов, в основном JavaScript, можно не только выводить изображения, но и рисовать их, трансформировать, менять свойства.   W3C
Наверх
Комментарии (0)
Петр Романовский
Есть общие вопросы по данному справочнику, пишите.
Показаны все комментарии
Чтобы оставить свой комментарий, авторизуйтесь, пожалуйста!    
     
belarusweb.net © Петр Романовский, Минск, 2016-2017.
Связаться с автором
Наверх