1)<!DOCTYPE> предназначен для указания типа текущего документа — DTD (document type definition, описание типа документа). Это необходимо, чтобы браузер понимал, как следует интерпретировать текущую веб-страницу, поскольку HTML существует в нескольких версиях, кроме того, имеется XHTML (EXtensible HyperText Markup Language, расширенный язык разметки гипертекста), похожий на HTML, но различающийся с ним по синтаксису. Чтобы браузер «не путался» и понимал, согласно какому стандарту отображать веб-страницу и необходимо в первой строке кода задавать <!DOCTYPE>.
Существует несколько видов <!DOCTYPE>, они различаются в зависимости от версии языка, на которого ориентированы. В табл. 1. приведены основные типы документов с их описанием.
Табл. 1. Допустимые DTD
DOCTYPE |
Описание |
|---|---|
HTML 4.01 |
|
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> |
Строгий синтаксис HTML. |
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> |
Переходный синтаксис HTML. |
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd"> |
В HTML-документе применяются фреймы. |
HTML 5 |
|
<!DOCTYPE html> |
Для всех документов. |
XHTML 1.0 |
|
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> |
Строгий синтаксис XHTML. |
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> |
Переходный синтаксис XHTML. |
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd"> |
Документ написан на XHTML и содержит фреймы. |
XHTML 1.1 |
|
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> |
Разработчики XHTML 1.1 предполагали, что он постепенно вытеснит HTML. Никакого деления на виды это определение не имеет, синтаксис один и подчиняется чётким правилам. |
2) <!-- -->
Добавляет комментарий в код документа. Текст комментария не отображается на странице и предназначен для пояснения кода или для технических целей. Разрешается внутрь комментария добавлять другие элементы, при этом недопустимо один комментарий вкладывать внутрь другого.
3) Элемент <a> является одним из важных в HTML и предназначен для создания ссылок. Для этого необходимо сообщить браузеру, что является ссылкой, а также указать адрес документа, на который следует сделать ссылку. В качестве значения атрибута href используется адрес документа, на который происходит переход. Адрес ссылки может быть абсолютным и относительным. Абсолютные адреса работают везде и всюду независимо от имени сайта или веб-страницы, где прописана ссылка. Относительные ссылки, как следует из их названия, построены относительно текущего документа или корня сайта.
4)
Элемент <abbr> указывает, что
последовательность символов является
аббревиатурой. С помощью атрибута title
даётся расшифровка сокращения, что
позволяет понимать аббревиатуру тем
людям, которые с ней не знакомы. Кроме
того, поисковые системы индексируют
полнотекстовый вариант сокращения, это
может использоваться для повышения
рейтинга документа.
Браузеры обычно добавляют к тексту пунктирное подчёркивание, но могут и не выделять содержимое элемента.
<abbr>Текст</abbr>5) Элемент <address> предназначен для хранения контактной информации автора (адрес, телефон, e-mail, ссылка на сайт и др.) и может включать в себя любые элементы HTML вроде ссылок, текста, выделений и т. д. Планируется, что поисковые системы будут анализировать содержимое этого элемента для сбора информации об авторах.
<address> не должен использоваться для разметки почтовых адресов в целом, только для контактной информации.
Используйте <address> в следующем контексте:
если <address> располагается внутри <body>, то информация внутри <address> относится ко всему документу в целом;
если <address> располагается внутри <article>, то информация внутри <address> относится к автору статьи.
По умолчанию текст внутри контейнера <address> отображается курсивным начертанием.
<address>Текст</address>6) Элемент <applet> предназначен для вставки на страницу апплетов — небольших программ, написанных на языке Java. Между открывающим и закрывающим тегом можно добавить текст, который будет отображаться в браузере, если он не поддерживает апплеты. В противном случае текст не выводится.
Этот элемент является устаревшим, взамен необходимо использовать <object>.
<applet code="<адрес>">Текст</applet>7) Каждый элемент <area> определяет активные области изображения, которые являются ссылками. Рисунок с привязанными к нему активными областями называется в совокупности картой-изображением. Такая карта по внешнему виду ничем не отличается от обычного изображения, но при этом оно может быть разбито на невидимые зоны разной формы, где каждая из областей служит ссылкой. Элемент <area> задаёт форму области, её размеры, устанавливает адрес документа, на который следует сделать ссылку. <area> всегда располагается в контейнере <map>, который связывает координаты областей с изображением.
Несколько областей могут перекрывать друг друга, сверху будет та, которая в коде HTML располагается выше.
<map><area href="<адрес>"></map>8) Элемент <article> задаёт содержание сайта вроде новости, статьи, записи блога, форума и др.<article></article>9) Представляет собой раздел страницы, который имеет косвенное отношение к содержимому страницы и может быть рассмотрен отдельно от этого содержимого. <aside> применяется для боковых панелей, рекламных блоков, ссылок на архив, меток и другой информации, которая отделена от основного содержимого страницы.<aside></aside>10) <audio> Добавляет, воспроизводит и управляет настройками аудиозаписи на веб-странице. Путь к файлу задаётся через атрибут src или вложенный элемент <source>. Внутри контейнера <audio> можно написать текст, который будет выводиться в браузерах, не работающих с этим элементом.
Для
универсального воспроизведения в
указанных браузерах аудио кодируют с
помощью разных кодеков и добавляют
файлы одновременно через элемент
<source>.
<audio src="URL"></audio><audio><source src="URL"></audio>Атрибуты:
- autoplay
- Звук начинает играть сразу после загрузки страницы.
- controls
- Добавляет панель управления к аудиофайлу.
- loop
- Повторяет воспроизведение звука с начала после его завершения.
- muted
- Отключает звук при воспроизведении музыки.
- src
- Указывает путь к воспроизводимому файлу.
11) <b> Устанавливает жирное начертание шрифта. Допустимо использовать этот элемент совместно с другими, которые определяют начертание текста.<b>Текст</b><!DOCTYPE html><html><head><meta charset="utf-8"><title>font-weight</title><style>.bold {font-weight: bold;}</style>12) Элемент <base> определен внутри контейнера <head> и инструктирует браузер относительно полного базового адреса текущего документа. <base> предназначен для документов, в которых используется относительный адрес и эти документы могут переноситься в другую папку или даже на другой компьютер без потери связи. Браузер ищет элемент <base>, определяет полный адрес документа и корректно загружает его. Например, если адрес документа указан как <base href="http://www.megasite.ru/hzchd/">, то при добавлении рисунков достаточно использовать относительный адрес <img src="images/labuda.gif">. При этом полный путь к изображению будет http://www.megasite.ru/hzchd/images/labuda.gif, что позволяет браузеру всегда находить графический файл, независимо от того, где находится текущая веб-страница. Также можно применять и иерархическую систему пути с двумя точками. Так, если изображение добавляется как <img src="../images/labuda.gif">, то полный путь к файлу будет http://www.megasite.ru/images/labuda.gif.
Второе применение элемента <base> — задание целевого окна для всех ссылок на текущей странице.
<head><baseатрибуты></head>
Атрибуты:
- href
- Адрес, который должен использоваться для указания полного пути к файлам.
- target
- Имя окна или фрейма, куда будет загружаться документ, открываемый по ссылке.
Если на странице встречается несколько элементов <base>, то берётся значение атрибутов только у первого элемента, остальные игнорируются.
13) Элемент <basefont> предназначен для задания шрифта, размера и цвета текста по умолчанию. Указанные значения будут использоваться во всём документе за исключением элемента <font>, в котором можно переопределить параметры оформления текста. <basefont> допустимо использовать внутри <head> или <body>, причём несколько раз. Это позволяет изменять вид шрифта для части документа.
Это нестандартный элемент, вместо него используйте стили.
<basefont атрибуты>14) Элемент <bdi> указывает фрагмент текста, который должен быть изолирован от изменения направления вывода текста. Такое поведение важно для текстов, одновременно содержащих разные языки, читающихся слева направо и справа налево.<bdi>Текст</bdi>15) Элемент <bdo> устанавливает направление вывода текста и преимущественно предназначен для использования с языками, где чтение происходит справа налево. Например, к ним относится арабский язык.<bdo>Текст</bdo>16) Элемент <bgsound> определяет музыкальный файл, который будет проигрываться на веб-странице при её открытии. Громкость, продолжительность звучания музыки и другие характеристики определяются с помощью атрибутов, а также могут управляться через скрипты. Этот элемент должен размещаться только в контейнере <head>.
<bgsound> не входит в спецификацию HTML и при его использовании код не пройдёт валидацию. Вместо него используйте <audio>.
<head><bgsound атрибуты></head>
- balance
- Управляет балансом звука между правой и левой колонками.
- loop
- Устанавливает, сколько раз проигрывать музыкальный файл.
- src
- Путь к музыкальному файлу.
- volume
- Задаёт громкость звучания музыки.
- 17) Элемент <blockquote> предназначен для выделения длинных цитат внутри документа. Текст, обозначенный этим тегом, традиционно отображается как выровненный блок с отступами слева и справа (примерно по 40 пикселей), а также с отбивкой сверху и снизу.
<blockquote>Цитата</blockquote>18) Элемент <big> увеличивает размер шрифта на единицу по сравнению с обычным текстом. В HTML размер шрифта измеряется в условных единицах от 1 до 7, средний размер текста, используемый по умолчанию, принят 3. Таким образом, добавление <big> увеличивает текст на одну условную единицу. Допускается применение вложенных элементов <big>, при этом размер шрифта будет больше с каждым уровнем.
Это нестандартный элемент, вместо него используйте стили.
<big>Текст</big>19) Элемент <body> предназначен для хранения содержимого веб-страницы (контента), отображаемого в окне браузера. Информацию, которую следует выводить в документе, следует располагать именно внутри контейнера <body>. К такой информации относится текст, изображения, теги, скрипты JavaScript и т. д.
<body> также применяется для определения цветов ссылок и текста на веб-странице. Подобная практика в HTML осуждается и взамен для указания цветовой схемы рекомендуется использовать стили, применяя их к селектору body.
Часто <body> используется для размещения обработчика событий, например, onload, которое выполняется после того, как документ завершил загрузку в текущее окно или фрейм.
Открывающий и закрывающий теги <body> на веб-странице не являются обязательными, однако хорошим стилем считается их использование, чтобы определить начало и конец HTML-документа.
<body>...</body>20) <blink> Устанавливает мигание текста.
Это нестандартный элемент, не применяйте его, взамен воспользуйтесь стилями.
<blink>Текст</blink>
В
качестве альтернативы применяется
стилевое свойство animation,
в параметрах которого указывается
бесконечная анимация.
<!DOCTYPE html><html><head><meta charset="utf-8"><title>Мигание</title><style>.blink {animation: blink 2s infinite;}@keyframes blink {from { opacity: 1; }to { opacity: 0; }}</style></head><body><p class="blink">Внимание</p></body></html>21) Элемент <br> устанавливает перевод строки в том месте, где он находится. В отличие от элемента <p>, использование <br> не добавляет пустой отступ перед строкой.Текст<br> текст22) Элемент <button> создаёт на веб-странице кнопки и по своему действию напоминает результат, получаемый с помощью <input> (с атрибутом type="button | reset | submit"). В отличие от этого элемента, <button> предлагает расширенные возможности по созданию кнопок. Например, на подобной кнопке можно размещать любые элементы HTML, в том числе изображения. Используя стили можно определить вид кнопки путём изменения шрифта, цвета фона, размеров и других параметров.<button>...</button>