Атрибуты в HTML. Создание и использование

Вы уже знакомы с несколькими html-тегами и их использованием, например теги заголовков , , или тег абзаца

И другие. До сих пор мы использовали их в простейшей форме, но большинство тегов в HTML могут иметь атрибуты, которые являются дополнительными битами информации.

Атрибут - используется для определения характеристик html-элемента и помещается внутри открытого тега элемента. Все атрибуты состоят из двух частей - это имя и значение :

  • Имя - это свойство, которое Вы хотите установить. Например, элемент абзаца

    В примере ниже, содержит атрибут align , который Вы можете использовать для указания выравнивания абзаца на странице.

  • Значение - это значение, которое Вы хотите установить для свойства. Значение атрибута всегда помещается в кавычки. В приведенном ниже примере показаны три возможных значения атрибута align: left , center и right .

Имена и значения атрибутов в HTML не зависят от регистра. Однако консорциум World Wide Web (W3C) рекомендует в своей рекомендации HTML 4 использовать атрибуты и значения атрибутов в нижнем регистре.

Пример

Пример атрибута align

Выровнено по левому краю.

Выровнено по центру.

Выровнено по правому краю.

Получим следующий результат:

Основные атрибуты HTML

Существует четыре основных атрибута в HTML, которые могут использоваться для большинства html-элементов (хотя и не для всех):

  • title
  • class
  • style
Атрибут id

Атрибут id html-тега может быть использован для однозначной идентификации любого элемента внутри html-страницы. Существуют две основные причины, по которым Вы можете использовать атрибут id для элемента:

  • Если элемент содержит атрибут id как уникальный идентификатор, то можно идентифицировать только этот элемент и его содержимое.
  • Если на веб-странице (или в таблице стилей) есть два элемента с одним и тем же именем, Вы можете использовать атрибут id для различения элементов, имеющих одно и то же имя.

Таблицу стилей мы обсудим в отдельном самоучителе . Пока же давайте использовать атрибут id для различения двух элементов абзаца, как показано ниже.

Этот абзац объясняет, что такое HTML.

Этот абзац объясняет, что такое каскадная таблица стилей (CSS).

Атрибут title

Атрибут title - дает название элемента для элемента. Синтаксис для атрибута title аналогичен атрибуту id.

Поведение этого атрибута будет зависеть от элемента, который его несет, хотя он часто отображается как подсказка, когда курсор наводится на элемент или когда элемент загружается.

Пример

Пример атрибута title Пример заголовка

Получим следующий результат:

Теперь попробуйте навести курсор на «Пример заголовка», и Вы увидите, что title, который Вы использовали в вашем коде, выйдет как подсказка курсора.

Атрибут class

Атрибут class - используется для связывания элемента со списком стилей и задает класс элементу. Вы узнаете больше об использовании атрибута class, когда изучите CSS (каскадные таблицы стилей). Так что пока можете это пропустить.

Значением атрибута может быть также список имен классов, разделенных пробелами. Например:

Class="названиеКласса1 названиеКласса2 названиеКласса3"

Атрибут style

Атрибут style - позволяет указывать правила каскадной таблицы стилей (CSS) внутри элемента.

Пример атрибута style

Немного текста...

Получим следующий результат:

На данный момент мы не изучаем CSS, так что давайте продолжим, не беспокоясь о CSS. Здесь Вам нужно понять, какие существуют html-атрибуты, и как их можно использовать при форматировании содержимого.

Атрибуты интернационализации

Существует три атрибута интернационализации в HTML, которые доступны для большинства (хотя и не для всех) элементов XHTML.

  • xml:lang
Атрибут dir

Атрибут dir - позволяет указать браузеру направление потока текста. Атрибут dir может принимать одно из двух значений, которые Вы можете видеть в следующей таблице:

Пример

Пример направления потока текста

Отображает направленный текст справа налево.

Получим следующий результат:

Когда атрибут dir используется в теге , он определяет, как текст будет представлен во всем документе. При использовании в другом теге он управляет направлением текста только для содержимого этого тега.

Атрибут lang

Атрибут lang - позволяет указать основной язык, используемый в документе, но этот атрибут хранится в HTML только для обратной совместимости с более ранними версиями HTML. Этот атрибут был заменен атрибутом xml:lang в новых xhtml-документах.

Значения атрибута lang - это стандартные двухсимвольные языковые коды ISO-639. Проверьте коды ISO-639 для языка HTML , перейдите по ссылке для получения полного списка кодов языков.

Пример

Русский язык страницы

Эта страница использует русский язык.

Атрибут xml:lang

Атрибут xml:lang - это XHTML замена для атрибута lang. Значение атрибута xml:lang должно быть ISO-639 кодом страны, которые указаны выше.

Общие атрибуты

Ниже представлена таблица некоторых других атрибутов, которые можно легко использовать со многими html-тегами.

Атрибут Опция Функция
align right, left, center Горизонтальное выравнивание тегов.
valign top, middle, bottom Вертикально выравнивает тегов внутри html-элемента.
bgcolor числовые, шестнадцатеричные, RGB значения Помещает фоновый цвет за элемент.
background URL Помещает фоновое изображение за элемент.
id определяется пользователем Именование элемента для использования с каскадными таблицами стилей.
class определяется пользователем Классифицирует элемент для использования с каскадными таблицами стилей.
width Задает ширину таблиц, изображений или ячеек таблицы. height числовое или процентное значение Задает высоту таблиц, изображений или ячеек таблицы. title определяется пользователем «Всплывающий» заголовок элементов.

Мы ещё увидим соответствующие примеры атрибутов при изучении других html-тегов (

Здравствуйте, уважаемые читатели блога сайт! В прошлой статье мы разобрались, а также что такое тип документа и как браузеры определяют используемый язык с помощью . Тег то рассмотрели, а вот само понятие (термин) нет. В этой статье я расскажу, что такое тег, зачем он нужен и какие теги бывают. Как я и говорил в прошлой статье данной рубрики, мы создадим файл-страничку, над которой будем экспериментировать, опираясь на полученные знания. Но это в конце статьи, а пока разберемся с HTML-тегом.

Что такое HTML-тег, виды HTML-тегов, примеры написанияHTML-тег — в переводе с английского tag — помечать -символы, заключенные в угловые скобки и являющиеся элементами языка гипертекстовой разметки (HTML). Символы могут быть толок на английском языке (весь интернет на нем построен). Тег имеет вид

Это тег выделения текста жирным шрифтом. Теги имеют три вида:

  • Открывающий тег - тег, стоящий в начале. В рассмотренном выше примере тег является открывающим и стоит перед тем текстом, который нужно выделить.
  • Закрывающий тег - тег, стоящий в конце. Отличительной чертой служит слеш «/» перед символами в угловых скобках. Опять же обратимся к рассмотренному выше примеру. Тег является закрывающим и стоит после текста, который следует выделить жирным
  • Одиночные теги — теги, которые не имеют закрывающего тега. Примером может служить
    Вот пример открывающего и закрывающего тега:

Вся конструкция, включая текст, будет выглядеть следующим образом:

Этот текст будет выделен жирным

А вот так будет выглядеть этот текст, когда его обработает браузер и предоставит нам:Этот текст будет выделен жирным. Существует еще такое понятие, как контейнерные теги , но это просто обобщенное название открывающего и закрывающего тегов. Как я писал выше, помимо контейнерных есть еще и одиночные теги. Отличие заключается в том, что такие теги не нужно закрывать. Ярким и наиболее частым примером служит тег новой строки.

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

Что такое атрибуты,правила написания и зачем они нужны Помимо тегов существуют еще и так называемые атрибуты . Точнее не помимо, а в тегах. С помощью атрибутов можно задать дополнительные параметры для какого-либо тега. Атрибуты для каждого тега свои, а в данной теме мы будем экспериментировать над тегом , который без атрибутов, собственно, ничего толкового не делает.

Font — контейнерный тег, применяемый для форматирования текста. С помощью данного тега вы сможете и выделить текст жирным, и изменить размер, и расстояние между строк — в общем все, что можно делать с текстом. Рассмотрим пример с размером текста. Для начала заключим текст в тег Font.

Текст

Теперь немного про правила написания атрибутов. Атрибуты всегда пишутся в открывающем теге и после символов самого тега. Можно написать в одном теге несколько атрибутов в любом порядке. Атрибуты вы можете найти на сайте валидатора W3C (про который я напишу чуть ниже). Итак, вот пример тега font с атрибутом size:

Текст

Данный атрибут в теге font изменяет размер заключенного в теги Текста.
Если вы откроете исходный код страницы, то увидите, что место, где находится большое слово «Текста» имеет вид

Текста

Вы уже увидели как пишутся атрибуты. Ровно также они пишутся и в других тегах: сначала пишем сам атрибут (в данном случае size), затем ставим «=» и заключаем параметр атрибута в двойные кавычки. Параметры атрибутов вы сможете найти все на том же сайте консорциума всемирной паутины.

Что такое валидатор (validator) W3C, правила написания и список тегов Как я и писал, существует великое множество тегов. Но где их всех найти? Вот для этой цели существует валидатор W3C W3C - World Wide Web Consorcium, а по-русски — консорциум всемирной паутины. Не совсем понятно, да? Это такое место, где разрабатывают веб-стандарты — (языки гипертекстовой разметки — их детище). Во главе всего консорциума стоит, известный из прошлой статьи, Тим Бернерс-Ли — создатель HTML. Сайт этой организации — w3.org . Предупреждаю, сайт полностью на английском, так что запаситесь словарем или переводчиком в браузере. Кстати, Google у данного сайта равен 9, а — 37000 (это все очень много, если кто не в курсе).

Возвращаемся к теме статьи. Нас интересуют стандарты языка HNTML 4.01. Переходим по ссылке HTML 4.01 Specification , после чего вверху видим вкладку elements , кликаем на нее. Вот и открывается страница со всеми тегами. Данные теги разработаны и приняты за стандарт консорциумом. Все, опять же, на английском. Сразу после слов «Index of Elements» мы видим легенду (значение букв в столбцах):

А сразу после легенды идет таблица самих тегов:

  • В первом столбце — Name — само название тега — то что должно стоять в угловых скобках (< и >).
  • Второй столбец — Start Tag — наличие открывающего тега. В данном столбце вы можете увидеть букву «O», что значит «Optional», а в переводе с английского - Опционально. Данная буква присутствует только напротив тегов , , и и означает, что можно ставить открывающий тег, а можно не ставить — браузер сам все сделает.
  • Третий столбец — End Tag — наличие закрывающего тега. Напротив данного тега можно увидеть как букву «O», так и букву «F». Значение первой не изменилось. Вторая же буква — «F» — дословно с английского «запрещено» — означает, что закрывающий тег ставить запрещено, его просто не существует. Например, не существует тега , ибо нечего в нем закрывать.
  • Четвертый - Empty — означает, что тег является одиночным (пустым). Все теги, напротив которых стоит буква «E» в данном столбце, стоит еще и буква «F» в предыдущем столбце. Ведь у одиночных тегов не бывает закрывающих. Примером служит все тот же тег .
  • Пятый столбец — Depr. или Deprecated — с английского «не рекомендуемые». Если в данном столбце стоит буква «D» (которая расшифровывается точно также) значит, что данный тег не рекомендуется к использованию в HTML. Забегая немного вперед, сегодня для оформления как текста, так и внешнего вида всего сайта и HTML-документа используются каскадные таблицы стилей — CSS. Если коротко и просто, то создается один файл, в котором прописываются все параметры текста, которые можно вызвать определенными атрибутами тегов. Так вот, данная функция используется только на сайтах, потому что при рассылке новостей по почте или в RSS CSS не применим. И тут приходит на помощь эти самые теги. Большинство таких тегов, кстати, относятся к оформлению текста ( и являются примером)
  • Шестой столбец — DTD — может содержать либо букву «L» , либо «F» . Первая — «L» - Loose DTD — означает, что тег, напротив которого стоит данная буква, может использоваться только в переходном типе документов ( — Transitional, про который я писал в предыдущей статье). Вторая — «F» — Frameset DTD — означает, что тег может использоваться только в документе, типа FRAMESET ( — Frameset). Если же буква отсутствует, то тег можно использовать во всех типах документов.
  • И последний, седьмой столбец - Description — краткое описание тега, опять же на английском

Атрибуты же содержаться на той же страничке спецификации HTML 4.01, но уже во вкладке «attributes». Атрибутов намного больше, нежели тегов. И опять распишу все по пунктам.

  • Первая колонка — Name — как и в случае с тегами — название атрибута. Все на английском, но имея базовые знания можно догадаться, что делает тот или иной атрибут.
  • Вторая колонка — Related Elements — это перечень всех тегов, в которых используется какой-либо атрибут. Все теги со ссылками, поэтому сразу можно будет перейти к информации о теге.
  • Третья колонка — Type — это все возможные значения определенного атрибута. Например напротив выбранного нами атрибута size в теге Font стоит значение CDATA. Его мы рассмотрим позже, а если коротко, то это специальный набор вариантов размера (в данном случае). Ведь можно писать как пиксели, так и проценты
  • Четвертая колонка — Default — означает, обязателен ли атрибут в определенном теге. Например, в теге Img атрибут src обязателен, так как указывает на источник, из которого брать картинку.
  • 6, 7, и 8 колонки означают то же самое, что и в случае с тегами.

Все вышеописанное относится только к HTML версии 4.01. Про HTML 5 мы поговорим в другой статье, затронем и XHTML. А сейчас, как я и обещал, мы создадим страничку на языке HTML, над которой и будем экспериментировать.

Создание файла в формате html — HTML-документ

Прежде всего, разберемся что такое HTML-документ . А это, собственно, файл в формате HTML. И все интернет странички являются HTML- документами. Например, при попадании на сайт в адресной строке в конце можно увидеть после адреса «.html» или «.htm». Вот файл с таким расширением мы и создадим. Вообще, если хотите экспериментировать над сайтом, а не над страничкой, то лучше создать локальный сервер — Денвер (про который я все хочу написать).

Учитывая то, что я не рассказал даже о тегах, присутствующих на каждой страничке, то просто создадим файл с любым именем и расширением.html. Можно (и лучше всего) использовать Notepad++ , потому что в данном текстовом редакторе используется подсветка кода, что очень удобно при редактировании кода и сохранять файлы можно во множестве форматов. Также есть программы, в которых при наборе кода сразу появляется результат в обработанном виде

Итак, нам нужно просто открыть Notepad++ и сохранить файл с произвольным текстом (можно и пустой), но в формате.html. Для этого, как обычно, кликаете на надпись файл, затем "сохранить как " и ищем среди большого списка расширений «HyperText Markup Language file (расширения файлов)». Вот, собственно, и все. Первые строки в этот файл мы добавим уже в следующей статье из рубрики «Создаем сайт с нуля»

Последнее обновление: 08.04.2016

Прежде чем переходить непосредственно к созданию своих веб-страниц на HTML5, рассмотрим основные строительные блоки, кирпичики, из которых состоит веб-страница.

Документ HTML5, как и любой документ HTML, состоит из элементов, а элементы состоят из тегов. Как правило, элементы имеют открывающий и закрывающий тег, которые заключаются в угловые скобки. Например:

Текст элемента div

Здесь определен элемент div , который имеет открывающий тег и закрывающий тег . Между этими тегами находится содержимое элемента div. В данном случае в качестве содержимого выступает простой текст "Текст элемента div".

Элементы также могут состоять из одного тега, например, элемент
, функция которого - перенос строки.

Текст
элемента div

Такие элементы еще называют пустыми элементами (void elements). Хотя я использовал закрывающий слеш, но его наличие согласно спецификации необязательно, и равнозначно использованию тега без слеша:

Каждый элемент внутри открывающего тега может иметь атрибуты . Например:

Кнопка

Здесь определено два элемента: div и input. Элемент div имеет атрибут style . После знака равно в кавычках пишется значение атрибута: style="color:red;" . В данном случае значение "color:red;" указывает, что цвет текста будет красным.

Второй элемент - элемент input, состоящий из одного тега, имеет два атрибута: type (указывает на тип элемента - кнопка) и value (определяет текст кнопки)

Существуют глобальные или общие для всех элементов атрибуты, как например, style, а есть специфические, применяемые к определенным элементам, как например, type.

Кроме обычных атрибутов существуют еще булевые или логические атрибуты (boolean attributes). Подобные атрибуты могут не иметь значения. Например, у кнопки можно задать атрибут disabled:

Атрибут disabled указывает, что данный элемент отключен.

Глобальные атрибуты

В HTML5 есть набор глобальных атрибутов , которые применимы к любому элементу HTML5:

    accesskey : определяет клавишу для быстрого доступа к элементу

    class : задает класс CSS, который будет применяться к элементу

    contenteditable : определяет, можно ли редактировать содержимое элемента

    contextmenu : определяет контекстное меню для элемента, которое отображается при нажатии на элемент правой кнопкой мыши

    dir : устанавливает направление текста в элементе

    draggable : определяет, можно ли перетаскивать элемент

    dropzone : определяет, можно ли копировать переносимые данные при переносе на элемент

    hidden : скрывает элемент

    id : уникальный идентификатор элемента. На веб-странице элементы не должны иметь повторяющихся идентификаторов

    lang : определяет язык элемента

    spellcheck : указывает, будет ли для данного элемента использоваться проверка правописания

    style : задает стиль элемента

    tabindex : определяет порядок, в котором по элементам можно переключаться с помощью клавиши TAB

    title : устанавливает дополнительное описание для элемента

    translate : определяет, должно ли переводиться содержимое элемента

Но, как правило, из всего этого списка наиболее часто используются три: class , id и style .

Пользовательские атрибуты

В отличие от предыдущей версии языка разметки в HTML5 были добавлены пользовательские атрибуты (custom attributes). Теперь разработчик или создатель веб-страницы сам может определить любой атрибут, предваряя его префиксом data- . Например:

Здесь определен атрибут data-color , который имеет значение "red". Хотя для этого элемента, ни в целом в html не существует подобного атрибута. Мы его определяем сами и устанавливаем у него любое значение.

Одинарные или двойные кавычки

Нередко можно встретить случаи, когда в html при определении значений атрибутов применяются как одинарные, так и двойные кавычки. Например:

И одинарные, и двойные кавычки в данном случае допустимы, хотя чаще применяются именно двойные кавычки. Однако иногда само значение атрибута может содержать двойные кавычки, и в этом случае все значение лучше поместить в одинарные:

Любой код содержит в себе команды управления, посредством которых выполняются определенные задачи. В каждом языке они называются по-разному, но суть у них одна и та же. Чтобы не запутаться в терминах и говорить на одном языке, давайте разберемся как называются и как используются команды HTML.

В пояснениях я буду приводить ссылки на спецификацию, а также на её перевод , о котором упоминал на странице HTML это.. . Упоминание о переводе А. Пирамидина имеется в официальной спецификации HTML, так что перевод можно считать качественным.

Немного по-другому обстоят дела с тегами, не трбующими обязательной закрывающей части. К их числу можно отнести теги, создающие элементы таблицы: . Ряд таблицы автоматически закроет тег тела таблицы . А вот закрывать тег таблицы надо обязательно, в противном случае всё содержимое страницы, следующее за таблицей, станет её частью и попадёт под влияние табличных настроек.

Запрещается закрывать теги, не производящие действий над гипертекстом - , ,
и другие. Требования для каждого тега указаны в спецификации. Ниже мы рассмотрим - где именно что указано. Повторим. В языке HTML существует два вида тегов:

  • Строковые (inline). Их ещё называют инлайновые.
  • Блоковые (block).
  • Конечный (/закрывающий) тег может быть:

  • Закрывающий тег () обязателен.
  • Закрывающий тег () не обязателен.
  • Закрывающий тег () запрещён.
  • атрибуты у тегов могут быть:

  • Обязательные.
  • Необязательные.
  • Эту информацию по каждому конкретному тегу можно получить в спецификации. Как ею пользоваться написано ниже. И ещё один важный момент касательно использования различных символов в HTML.

    При html-верстке иногда приходится использовать символы, которые могут трактоваться двояко. Например, употребление символов "" будет расценено обозревателями как часть тега, то есть как служебный символ, а это не всегда так. Поэтому проблемные символы кодируются. Называются такие закодированные символы мнемониками. Список мнемоник можно посмотреть в спецификации .

    Вложенность тегов

    Теги могут быть вложенными друг в друга как матрёшки. При этом они делятся на родительские и дочерние элементы. Поясню на примере:

    Элемент подчёркнутого текста является родительским элементом для элемента зачёркнутого текста с наследованием.

    Дочерние элементы наследуют характеристики родительских. Таким образом зачёркнутый текст будет также и подчёркнутым.

    Главное помнить, что обе части тега (открывающая и закрывающая) должны быть вложены в один и тот же родительский элемент, опять же по аналогии с матрёшкой.

    Использование спецификации

    Официальной на данный момент (март 2012) является версия HTML 4.01, версия HTML 5.0 находится в активной разработке, но стандартом ещё не является, несмотря на многочисленные публикации в сети на тему HTML 5.

    Теперь о том, как пользоваться спецификацией. Допустим, нас интересуют вышеупомянутые таблицы. Открываем краткое содержание и выбираем соответствующий пункт (№11) - Таблицы.

    Открываем спецификацию, меню разделов:

    Тут можно получить информацию по каждому атрибуту.

  • Требования закрывающего тега (). В данном случае начальный и конечный теги обязательны.
  • Названия атрибутов данного тега.
  • Список значений каждого атрибута.
  • Статус атрибута (Актуальный/Устаревший/Запрещённый).
  • Тип данных (значений) атрибута.
  • Список общих атрибутов, которые используются с любыми тегами.
  • Важное замечание. На скриншоте выше атрибут align имеет статус Deprecated (не рекомендован). Такой атрибут не будет работать (и будет ошибкой) в DOCTYPE Strict . Так что использовать deprecated-элементы я крайне не рекомендую. Статус любого элемента можно посмотреть в общем списке.

    Уточнения по тегам:

  • Название тега.
  • Статус открывающего тега в документе html:
    • O - optional (не обязателен)
  • Статус закрывающего тега в документе html:
    • O - optional (не обязателен)
    • F - forbidden (запрещён)
  • Предполагается ли содержимое (гипертекст):
    • E - Empty (без содержимого)
  • Статус тега (D, L и F):
    • D - deprecated (не рекомендован).
    • L - loose (допускается в переходной спецификации Transitional).
    • F - Frameset (допускается в спецификации Frameset).
  • HTML - язык гипертекстовой разметки. В его основе лежат так называемые теги. Теги - это некие элементы обвертки, задающие формат и свойства элементов веб-страницы. На одной странице мы собрали для вас актуальный справочник тегов HTML.

    Всего насчитывается более ста элементов разметки. Каждый имеет ряд атрибутов и собственный синтаксис. Справочник по тегам HTML поможет быстрой найти нужный вам элемент.

    Список тегов HTML

    Ниже в таблице представлен список тегов HTML5 с кратким описанием на русском языке.

    Тег Краткое описание
    Комментарий.
    Определяет тип документа.
    Ссылка, гиперссылка, якорь.
    Определяет текст как аббревиатуру.
    Контактная информация автора или владельца документа.
    Определяет область на карте-изображении
    Статья
    Контент в стороне (содержимое не является основным на странице по смыслу)
    Позволяет вставить воспроизводимый аудио файл.
    Полужирный текст.
    Задает базовый URL или аттрибут target для относительных ссылок в документе.
    Область, где написание текста может имееть другое направления.
    Устанавливает направление написания текста. В отличии от направление указывается физическое направление
    Цитата.
    Указывает область body документа.

    Перенос строки.
    Кликабельная кнопка
    Используется для рисовании графики с помощью скриптов
    Подпись таблицы.
    Сноска на название материала.
    Используется для вставки компьютерного кода в текстовом виде.
    Задает характеристики колонок в таблице.
    Определяет группу из одной или более колонок таблицы для форматирования.
    Используется для определения предопределенных вариантов на выбор при вводе в текстовом поле
    Определяет описание термина из тега в списке терминов
    Текст, который удален в новой версии документа.
    Определяет дополнительную информацию, которую пользователь может просмотреть или скрыть
    Указывает, что содержимое является термином.
    Определяет диалоговое окно или интерактивный элемент
    Блочный элемент - один из основных элементов верстки.
    Определяет список определений
    Название термина в списке определений
    выделенный по смыслу текст (обычно, текст выделенный курсивом).
    Контейнер для внешнего приложения
    Группа связанных элементов в форме
    Заголовок для элемента
    Определяет автономную группу из нескольких элементов (например картинка с подписью)
    Нижний колонтитул
    Определяет форму пользовательского ввода
    - Заголовки HTML разного уровня: , , , , , .
    Указывает область head документа.
    Блок заголовка
    Горизонтальная линия - тематический разделитель.
    Корневой элемент. Сообщает браузеру, что данный документ является HTML документом.
    Выделяет текст курсивом.
    Определяет встроенный фрейм
    Изображение, картинка.
    Поле для ввода
    Текст, который был добавлен в новой версии документа.
    Текст введенный с клавиатуры или названия кнопок клавиатуры. Обычно выделен моноширинным шрифтом.
    Метка для поля ввода. Указывает на привязку элемента (обычно текста) к полю ввода.
    Заголовок элементов
  • Элемент списка
    Определяет привязку внешнего ресурса (чаще всего, привязку таблицы стилей CSS)
    Основной контент
    Контейнер для . Определяет пользовательскую карту на изображении
    Выделенный текст (обычно с помощью подсветки фона).
    Контейнер для списка пунктов меню
    Определяет элементы, которые пользователь может вызвать из контекстного меню
    Используется для определения мета-данных документа.
    Измеритель значений в заданном диапазоне
    Контейнер для навигационных элементов
    Альтернативный контент для пользователей, отключивших скрипты
    Определяет встроенный объект
    Определяет нумерованный список
    Определяет группу связанных вариантов в выпадающем списке. Дает название группу
    Параметр (вариант выбора) в выпадающем списке
    Результат вычислений

    Абзац.
    Задает параметры для встроенных объектов
    Контейнер для нескольких изображений
    Предварительно отформатированный текст.
    Индикатор выполнения (прогресса)
    Цитата в тексте.
    Альтернативный текст, если браузер не поддерживает тег .
    Аннотация к содержимому тега .
    Контейнер для символов и их расшифровки (в основном для Восточно-азиатских символов, иероглифов).
    Перечеркнутый текст.
    Текст, являющийся результатом выполнения компьютерной программы (обычно выводится моноширинным шрифтом).
    Определяет скрипт или подключение скрипта из внешнего ресурса.
    Раздел
    Определяет выпадающий список
    Текст шрифтом меньшего размера.
    Определяет ресурс для тегов , и .
    Строчный элемент.
    Текст, выделенный по значению. Обычно отображается полужирным.
    Определяет контейнер для определения стилей документа
    Отображает текст в виде нижнего индекса.
    Заголовок внутри тега
    Отображает текст в виде верхнего индекса.
    Определяет таблицу.
    Определяет область контента в таблице.
    Ячейка в таблице .
    Многострочное поле для ввода
    Определяет группу строк в нижней части таблицы - нижний колонтитул. Подробнее
    Место, где допускается перенос строки.
    Устаревшие теги HTML

    Чем заменить устаревший тег HTML? В большинстве случаев подойдут каскадные таблицы стилей CSS. Также, существуют альтернативы не используемым в новой спецификации тегам и в пределах HTML. Ниже в таблице представлены устаревшие теги HTML с вариантами их замены.

    Тег Краткое описание
    Акроним. Используйте тег вместо него
    Встроенный апплет. Используйте или вместо него.
    Задает цвет, размер, и семейство шрифта всего текста в документе. Используйте вместо него
    Текст большего размера. Используйте вместо него
    Отцентрованный текст. Используйте вместо него
    Список директорий. Используйте
      вместо него
    Определяет цвет, размер и семейство шрифта. Используйте вместо него
    Фрейм внутри . Используйте вместо него
    Определяет набор фреймов. Для добавления нескольких встроенных фреймов используйте несколько элементов
    Альтернативный текст, если фреймы не поддерживаются
    Перечеркнутый текст. Используйте или вместо него
    Моноширный текст. Используйте вместо него
    Подчеркнутый текст. Используйте вместо него