HTML |
---|
Сравнения |
Элемент HTML - это тип компонента документа HTML (язык гипертекстовой разметки), один из нескольких типов узлов HTML (есть также текстовые узлы, узлы комментариев и другие). [ расплывчато ] HTML-документ состоит из дерева простых HTML- узлов , таких как текстовые узлы и HTML-элементы, которые добавляют семантику и форматирование к частям документа (например, выделяют текст полужирным шрифтом, организуют его в абзацы, списки и таблицы или вставлять гиперссылки и изображения). Для каждого элемента можно указать атрибуты HTML . Элементы также могут иметь контент, включая другие элементы и текст.
Как обычно понимается, позиция элемента указывается как охватывающая начальный тег, возможно включающая некоторый дочерний контент, и заканчивается конечным тегом. [1] Это относится ко многим, но не ко всем элементам в документе HTML. Это различие явно подчеркнуто в Спецификации HTML 4.01 :
Элементы не являются тегами. Некоторые люди называют элементы тегами (например, «тег P»). Помните, что элемент - это одно, а тег (будь то начальный или конечный тег) - другое. Например, всегда присутствует элемент HEAD, даже если в разметке могут отсутствовать как начальный, так и конечный теги HEAD. [1]
Точно так же в рекомендации W3C HTML 5.1 2nd Edition прямо говорится:
Теги используются для разграничения начала и конца элементов в разметке. (...) Начальный и конечный теги некоторых нормальных элементов могут быть опущены, (...)
Содержимое элемента должно быть размещено между сразу после начального тега (что может подразумеваться в некоторых случаях) и непосредственно перед конечный тег (который, опять же , в некоторых случаях может подразумеваться ).- HTML 5.1 2-е издание § 8.1.2. Элементы § Теги
а также:
Некоторые теги можно не указывать .
ПРИМЕЧАНИЕ.
Отсутствие начального тега элемента (...) не означает, что элемент отсутствует; это подразумевается, но все еще существует. Например, в документе HTML всегда есть корневой <html>элемент, даже если строка <html>нигде не отображается в разметке.- HTML 5.1 2-е издание § 8.1.2.4. Необязательные теги
Поскольку HTML (до HTML5) основан на SGML , [2] его синтаксический анализ также зависит от определения типа документа (DTD) , в частности от HTML DTD (например, HTML 4.01 [3] [примечание 1] ). DTD определяет, какие типы элементов возможны (т. Е. Определяет набор типов элементов), а также допустимые комбинации, в которых они могут появляться в документе. Это часть общего поведения SGML: там, где возможна только одна допустимая структура (в соответствии с DTD), ее явное выражение в любом заданном документе обычно не требуется. В качестве простого примера тег, указывающий начало элемента абзаца, должен быть дополнен<p>
</p>
тег, обозначающий его конец. Но поскольку DTD утверждает, что элементы абзаца не могут быть вложенными, фрагмент документа HTML считается эквивалентным . (Если один пункт элемент не может содержать другой, любой в настоящее время открыт пункт должен быть закрыт до начала другого.) Поскольку этот вывод основан на комбинации DTD и отдельного документа, это не всегда возможно сделать вывод элементов из тегов документа в одиночку , но только при использовании синтаксического анализатора с поддержкой SGML или HTML со знанием DTD. HTML5 дает аналогичный результат, определяя, какие теги можно опустить. [4]<p>Para 1 <p>Para 2 <p>Para 3
<p>Para 1 </p><p>Para 2 </p><p>Para 3
SGML сложен, что ограничивает его широкое понимание и распространение. XML был разработан как более простая альтернатива. Хотя оба могут использовать DTD для определения поддерживаемых элементов и их разрешенных комбинаций в качестве структуры документа, синтаксический анализ XML проще. Отношение тегов к элементам всегда связано с анализом фактических тегов, включенных в документ, без подразумеваемых замыканий, которые являются частью SGML. [заметка 2]
HTML, используемый в текущей сети, вероятно, будет рассматриваться либо как XML, будучи XHTML , либо как HTML5 ; в любом случае синтаксический анализ тегов документа в элементы объектной модели документа (DOM) упрощен по сравнению с устаревшими системами HTML. После получения DOM элементов поведение на более высоких уровнях интерфейса (пример: рендеринг экрана) идентично или почти идентично. [заметка 3]
%block;
против коробкиЧастью этого поведения представления CSS является понятие « блочной модели ». Это применяется к тем элементам, которые CSS считает «блочными» элементами, установленными через объявление CSS .display: block;
HTML также имеет похожую концепцию, хотя и отличается, и их очень часто путают. %block;
и %inline;
являются группами в HTML DTD, которые группируют элементы как «блочные» или «встроенные». [6] Это используется для определения их поведения вложения: элементы уровня блока не могут быть помещены во встроенный контекст. [примечание 4] Это поведение нельзя изменить; это зафиксировано в DTD. Блочные и встроенные элементы имеют соответствующее и различное поведение CSS, прикрепленное к ним по умолчанию [6], включая релевантность блочной модели для определенных типов элементов.
Однако обратите внимание, что это поведение CSS может и часто изменяется от значения по умолчанию. Списки с элементами являются элементами и по умолчанию представлены в виде блочных элементов. Однако довольно часто они задаются с помощью CSS для отображения в виде встроенного списка. [7]<ul><li> ...
%block;
В синтаксисе HTML большинство элементов записываются с помощью начального и конечного тегов, а содержимое находится между ними. HTML тег состоит из имени элемента, в окружении угловых скобок . Конечный тег также имеет косую черту после открывающей угловой скобки, чтобы отличать его от начального тега. Например, абзац, представленный <p>
элементом, будет записан как:
< p > В синтаксисе HTML большинство элементов написано ... </ p >
Однако не все эти элементы требуют наличия конечного тега или даже начального тега. [4] Некоторые элементы, так называемые элементы void , не имеют закрывающего тега. Типичный пример - <br>
элемент (жесткий перенос строки). Поведение пустого элемента предопределено и не может содержать никакого содержимого или других элементов. Например, адрес будет записан как:
< Р > П. Шерман < бр > 42 Wallaby Way < бр > Сидней </ P >
При использовании XHTML необходимо открывать и закрывать все элементы, включая пустые. Это можно сделать, поместив закрывающий тег сразу после начального тега, но это недопустимо в HTML 5 и приведет к созданию двух элементов. Альтернативный способ указать , что он является недействительным элемент, который совместим с XHTML и HTML 5, чтобы положить /
в конце тега (не следует путать с /
в начале закрывающего тега).
< Р > П. Шерман < бр /> 42 Wallaby Way < бр /> Сидней </ P >
Атрибуты HTML указываются внутри начального тега. Например, <abbr>
элемент, представляющий аббревиатуру , ожидает наличие title
атрибута в своем открывающем теге. Это можно было бы записать так:
< abbr title = "abbreviation" > abbr. </ abbr >
Существует несколько видов HTML- элементов: обычные элементы, необработанные текстовые элементы и пустые элементы.
Обычные элементы обычно имеют как начальный тег, так и конечный тег, хотя для некоторых элементов конечный тег или оба тега могут быть опущены. Он устроен аналогично:
<tag>
</tag>
Необработанные текстовые элементы (также известные как текстовые или только текстовые элементы) создаются с помощью:
<tag>
</tag>
Например, <title>
элемент не должен содержать других элементов (включая разметку текста), только простой текст.
Пустые элементы (также иногда называемые пустыми элементами, отдельными элементами или автономными элементами) имеют только начальный тег (в форме), который содержит любыеатрибуты HTML. Они не могут содержать дочерних элементов, таких как текст или другие элементы. Для совместимости сXHTMLспецификация HTML допускает необязательный пробел и косую черту (допустимо). Пробел и косая черта требуются вXHTMLи другихприложенияхXML. Два общих элемента void - это(дляжесткого переноса строки, например, в стихотворении или адресе) и(для тематического разрыва). Другие такие элементы часто являются заполнителями, которые ссылаются на внешние файлы, такие как изображение (<tag>
<tag />
<br />
<hr />
<img />
) элемент. Атрибуты, включенные в элемент, будут указывать на рассматриваемый внешний файл. Другой пример элемента void <link />
, синтаксис которого:
< link rel = "stylesheet" href = "fancy.css" type = "text / css" >
Этот <link />
элемент указывает браузеру на таблицу стилей для использования при представлении HTML-документа пользователю. Обратите внимание, что атрибуты синтаксиса HTML не должны заключаться в кавычки, если они состоят только из определенных символов: букв, цифр, дефиса с минусом и точки. С другой стороны, при использовании синтаксиса XML (XHTML) все атрибуты должны быть заключены в кавычки, а перед последней угловой скобкой требуется разделенная косая черта :
<link rel = "stylesheet" href = "fancy.css" type = "text / css" />
Атрибуты HTML определяют желаемое поведение или указывают дополнительные свойства элемента. Для большинства атрибутов требуется значение . В HTML значение можно оставить без кавычек, если оно не включает пробелы (), или оно может быть заключено в одинарные или двойные кавычки (или). В XML эти кавычки обязательны.attribute=value
attribute='value'
attribute="value"
С другой стороны, логические атрибуты не требуют указания значения. Примером являются checked
флажки для:
< Входной тип = флажок проверил >
Однако в синтаксисе XML (и, следовательно, XHTML ) имя должно повторяться как значение:
<input type = "checkbox" checked = "checked" />
Неформально элементы HTML иногда называют «тегами» (пример synecdoche ), хотя многие предпочитают термин « тег» строго по отношению к разметке, разграничивающей начало и конец элемента.
Имена элементов (и атрибутов) могут быть записаны в любой комбинации верхнего или нижнего регистра в HTML, но должны быть в нижнем регистре в XHTML. [8] Каноническая форма была прописной до HTML 4 и использовалась в спецификациях HTML, но в последние годы строчные буквы стали более распространенными.
Элементы HTML определены в серии свободно доступных открытых стандартов, выпущенных с 1995 года, сначала IETF, а затем W3C .
Во время войны браузеров 1990-х годов разработчики пользовательских агентов (например, веб-браузеров ) часто разрабатывали свои собственные элементы, некоторые из которых были приняты в более поздних стандартах. Другие пользовательские агенты могут не распознавать нестандартные элементы, и они будут проигнорированы, что может привести к неправильному отображению страницы.
В 1998 году XML (упрощенная форма SGML) представил механизмы, позволяющие каждому разрабатывать свои собственные элементы и включать их в документы XHTML для использования с пользовательскими агентами, поддерживающими XML. [9]
Впоследствии HTML 4.01 был переписан в XML- совместимую форму, XHTML 1.0 ( расширяемый HTML ). Элементы в каждом из них идентичны, и в большинстве случаев допустимые документы XHTML 1.0 будут действительными или почти действительными документами HTML 4.01. Эта статья в основном посвящена настоящему HTML, если не указано иное; однако он остается применимым к XHTML . См. В HTML обсуждение незначительных различий между ними.
Начиная с первой версии HTML, некоторые элементы устарели и устарели в более поздних стандартах или вообще не отображаются, и в этом случае они недействительны (и будут признаны недействительными и, возможно, не будут отображаться при проверке пользовательских агентов) . [10]
В HTML 4.01 / XHTML 1.0 статус элементов усложняется существованием трех типов DTD :
HTML5 вместо этого предоставляет список устаревших функций вместе со стандартизированным нормативным содержанием. Они подразделяются на «устаревшие, но соответствующие», для которых существуют инструкции по реализации, и «несоответствующие», которые следует заменить. [11]
Первый стандарт ( HTML 2.0 ) содержал четыре устаревших элемента, один из которых был недопустимым в HTML 3.2 . Все четыре недопустимы в HTML 4.01 Transitional , который также устарел еще десять элементов. Все они, а также два других недопустимы в HTML 4.01 Strict . Хотя элементы фрейма все еще актуальны в том смысле, что они присутствуют в DTD Transitional и Frameset, нет планов по их сохранению в будущих стандартах, поскольку их функции были в значительной степени заменены, и они очень проблематичны для доступности для пользователей.
(Строго говоря, самый последний стандарт XHTML , XHTML 1.1 (2001), вообще не включает фреймы; он приблизительно эквивалентен XHTML 1.0 Strict , но также включает модуль разметки Ruby .) [12]
Распространенный источник путаницы - это нерекомендуемое использование слова deprecated для обозначения как устаревшего, так и недопустимого статуса, а также элементов, которые, как ожидается, будут официально признаны устаревшими в будущем.
Начиная с HTML 4, в HTML все больше внимания уделяется отделению содержимого (видимого текста и изображений) от представления (например, цвета, размера шрифта и макета). [13] Это часто называют разделением интересов . HTML используется для представления структуры или содержимого документа, его представление остается исключительной ответственностью таблиц стилей CSS . Таблица стилей по умолчанию предлагается как часть стандарта CSS, предоставляя визуализацию по умолчанию для HTML. [14]
Поведение (интерактивность) также отделено от контента и обрабатывается скриптами . Изображения содержатся в отдельных графических файлах, отдельно от текста, хотя их также можно рассматривать как часть содержимого страницы.
Разделение проблем позволяет представлять документ различным пользовательским агентам в соответствии с их целями и возможностями. Например, пользовательский агент может выбрать подходящую таблицу стилей для представления документа путем отображения на мониторе, печати на бумаге или для определения характеристик речи в пользовательском агенте только со звуком. Структурные и семантические функции разметки в каждом случае остаются идентичными.
Исторически пользовательские агенты не всегда поддерживали эти функции. В 1990-х годах в HTML были добавлены презентационные элементы (например, <b>
и <i>
) за счет создания проблем для взаимодействия и доступности для пользователей. Сейчас это считается устаревшим и заменено дизайном на основе таблиц стилей; большинство презентационных элементов объявлены устаревшими. [15]
Файлы внешних изображений объединяются с элементами <img />
или <object />
. (С XHTML , то SVG язык может также использоваться для графики записи внутри документа, хотя ссылки на внешние SVG файлы , как правило , проще.) [16] Если изображение не является чисто декоративным, HTML позволяет использовать содержимое замены с аналогичным семантическим значением будет предоставляется для невизуальных пользовательских агентов.
HTML-документ также может быть расширен за счет использования сценариев, чтобы обеспечить дополнительное поведение, выходящее за рамки возможностей гиперссылок и форм HTML.
Элементы <style>
и <script>
со связанными атрибутами HTML предоставляют таблицы стилей и сценарии.
<style />
и <script />
может ссылаться на общие внешние документы, или <style>...</style>
и <script>...</script>
могут содержать встроенные инструкции. (Этот <link>
элемент также можно использовать для связывания таблиц стилей.)<script />
или <script>...</script>
может встречаться в любом месте документа (голова или тело).style
Атрибут действует в большинстве элементов документа тела (например <div style="...">
) для включения встроенных стилей инструкций.<noscript>...</noscript>
элемент предоставляет встроенное альтернативное содержимое там, где это необходимо; однако его можно использовать только в заголовке документа и в теле как элемент уровня блока.<html>...</html>
<head>...</head>
Контейнер для обработки информации и метаданных HTML-документа.
<body></body>
Контейнер для отображаемого содержимого HTML-документа.
<base />
href
и других ссылок в документе. Должен стоять перед любым элементом, который ссылается на внешний ресурс. HTML разрешает только один <base>
элемент для каждого документа. У этого элемента есть атрибуты HTML , но нет содержимого.BASE
) упоминается в тегах HTML ; стандартизирован в HTML 2.0 ; все еще в силе.<basefont /> (deprecated)
<font>
элементами. Устарело в пользу таблиц стилей .<isindex /> (deprecated)
<isindex>
может появляться либо в заголовке документа, либо в теле, но только один раз в документе. См. Формы .<link />
<link rel="stylesheet" type="text/css" href="url" title="description_of_style">
<link rel="next" href="url">
<head>
<link />
LINK
существовал в HTML Internet Draft 1.2 и был стандартизирован в HTML 2.0 ; все еще в силе.<meta />
Может использоваться для указания дополнительных метаданных о документе, таких как его автор, дата публикации, срок действия, язык, заголовок страницы, описание страницы, ключевые слова или другая информация, не предоставляемая через другие элементы заголовка и атрибуты HTML . Из-за своей общей природы <meta />
элементы определяют ассоциативные пары "ключ-значение" . Как правило, мета-элемент передает скрытую информацию о документе. Можно использовать несколько метатегов, каждый из которых должен быть вложен в элемент заголовка. Конкретное назначение каждого <meta />
элемента определяется его атрибутами. Вне XHTML он часто дается без косой черты ( <meta>
), несмотря на то, что является пустым элементом .
В одной форме <meta />
элементы могут указывать заголовки HTTP, которые должны быть отправлены веб-сервером перед фактическим содержимым. Например, указывает, что страница должна обслуживаться с вызываемым HTTP-заголовком , имеющим значение .<meta http-equiv="foo" content="bar" />
foo
bar
<meta />
элемент определяет name
и связанные content
атрибуты HTML, описывающие аспекты страницы HTML. Чтобы предотвратить возможную двусмысленность, scheme
может быть предоставлен необязательный третий атрибут, чтобы указать семантическую структуру, которая определяет значение ключа и его значение. Например, в тех элементах , идентифицируют себя как содержащий элемент, со значением , от постоянного тока или Dublin Core описания ресурсов рамок .<meta name="foo" content="bar" scheme="DC" />
<meta />
foo
bar
<object>...</object>
<head>
элементе, он потенциально может использоваться для извлечения сторонних данных и связывания их с текущим документом.<script>...</script>
src
атрибутом. [19] Также может использоваться в теле документа для динамической генерации как блочного, так и встроенного содержимого.<style>...</style>
<style type="text/css"> ... </style>
@import
<style> @import url; </style>
<title>...</title>
<title>
Элемент не должен содержать другие элементы, только текст. В <title>
документе разрешен только один элемент.В визуальных браузерах отображаемые элементы могут отображаться как блочные или встроенные . Хотя все элементы являются частью последовательности документа, блочные элементы появляются внутри своих родительских элементов:
И наоборот, встроенные элементы обрабатываются как часть потока текста документа; они не могут иметь поля, ширину или высоту, а также разрываются по строкам.
Блочные элементы или блочные элементы имеют прямоугольную структуру. По умолчанию эти элементы будут охватывать всю ширину своего родительского элемента и, таким образом, не позволят никакому другому элементу занимать то же горизонтальное пространство, на котором он размещен.
Прямоугольная структура блочного элемента часто называется коробчатой моделью и состоит из нескольких частей. Каждый элемент содержит следующее:
Вышеупомянутый раздел относится только к подробной реализации рендеринга CSS и не имеет отношения к самим элементам HTML.
<p>...</p>
P
существовал в тегах HTML и был стандартизирован в HTML 2.0 ; все еще в силе.<h1>...</h1>
<h2>...</h2>
<h3>...</h3>
<h4>...</h4>
<h5>...</h5>
<h6>...</h6>
h1
ограничивает заголовок самого высокого уровня, h2
следующий уровень ниже (подраздел), h3
уровень ниже этого и так далее h6
. Иногда их вместе называют тегами, n означает любой из доступных уровней заголовков. Большинство визуальных браузеров по умолчанию отображают заголовки в виде большого полужирного текста, хотя это можно изменить с помощью CSS . Элементы заголовка не предназначены только для создания большого или полужирного текста - фактически, их не следует использовать для явного стилизации текста. Скорее, они описывают структуру и организацию документа. Некоторые программы используют их для создания схем и оглавлений.hn
<dl>...</dl>
DL
существовал в тегах HTML и был стандартизирован в HTML 2.0 ; все еще в силе.<dt>...</dt>
DT
существовал в тегах HTML и был стандартизирован в HTML 2.0 ; все еще в силе.<dd>...</dd>
DD
существовал в тегах HTML и был стандартизирован в HTML 2.0 ; все еще в силе.<ol>...</ol>
type
Атрибут может быть использован для определения вида маркеров использования в списке, но таблицы стилей дают больший контроль. По умолчанию используется арабская нумерация. В качестве атрибута HTML: ; или в объявлении CSS: - заменив одним из следующих:<ol type="foo">
ol { list-style-type: foo; }
foo
A
; Значение CSS:upper-alpha
a
; Значение CSS:lower-alpha
I
:; Значение CSS:upper-roman
i
; Значение CSS:lower-roman
1
;decimal
none
и параметры для CJK , иврита, грузинского и армянского алфавита.OL
существовал в HTML Internet Draft 1.2 и был стандартизирован в HTML 2.0 ; все еще в силе.<ul>...</ul>
<ul type="foo">
ul { list-style-type: foo; }
foo
disc
square
circle
none
UL
существовал в тегах HTML и был стандартизирован в HTML 2.0 ; все еще в силе.<li>...</li>
ol
) или неупорядоченных ( ul
) списках.LI
существовал в тегах HTML и был стандартизирован в HTML 2.0 ; все еще в силе.<dir>...</dir> (deprecated)
<ul>
DIR
существовал в тегах HTML и был стандартизирован в HTML 2.0 ; устарело в HTML 4.0 Transitional ; недействителен в HTML 4.0 Strict .<address>...</address>
ADDRESS
существовал в тегах HTML и был стандартизирован в HTML 2.0 ; все еще в силе.<article>...</article>
<aside>...</aside>
<blockquote>...</blockquote>
Блочный уровень котировка , когда котировка включает в себя элементы уровня блока, например , пункты. cite
Атрибут (не следует путать с <cite>элементом) может дать источник, и должен быть полностью квалифицирован унифицированный идентификатор ресурса .
BLOCKQUOTE
существовал в HTML Internet Draft 1.2 и был стандартизирован в HTML 2.0 ; все еще в силе. См. Дополнительную информацию в элементе цитаты .<center>...</center> (deprecated)
<del>...</del>
<div>...</div>
<figure>...</figure>
<figcaption>
.<figure>
элемента.<header>...</header>
<hr />
<ins>...</ins>
<main>...</main>
<ul>
список.MENU
существовал в тегах HTML и был стандартизирован в HTML 2.0 ; устарело в HTML 4.0 Transitional ; недействителен в HTML 4.0 Strict ; затем переопределено в HTML5 , но удалено в HTML 5.2.<noscript>...</noscript>
<pre>...</pre>
<pre>...</pre>
, пробелы должны отображаться как созданные. (С свойствами CSS: другие элементы могут быть представлены таким же образом.) Этот элемент может содержать любой встроенный элемент , за исключением: , , , , , и .{ white-space: pre; font-family: monospace; }
<image><object><big><small><sup><sub>...</sub>PRE
существовал в HTML Internet Draft 1.2 и был стандартизирован в HTML 2.0 ; все еще в силе.<section>...</section>
<script>...</script>
<script />
с src
атрибутом для предоставления URL-адреса, с которого следует загрузить скрипт, или как <script>...</script>
вокруг встроенного содержимого скрипта.Примечание: <script>
сам по себе не является ни блоком, ни встроенным элементом; сам по себе он не должен отображаться вообще, но может содержать инструкции для динамической генерации как блочного, так и встроенного контента.Встроенные элементы нельзя размещать непосредственно внутри элемента; они должны быть полностью вложены в элементы уровня блока. [24]<body>
<a>...</a>
Элемент привязки называется привязкой, потому что веб-дизайнеры могут использовать его для «привязки» URL-адреса к некоторому тексту на веб-странице. Когда пользователи просматривают веб-страницу в браузере, они могут щелкнуть текст, чтобы активировать ссылку и посетить страницу, URL-адрес которой находится в ссылке. [25]
В HTML якорь может быть либо исходным ( текст привязки ), либо конечным (местом назначения) концом гиперссылки .
С помощью атрибута href
, [26] якорь становится гиперссылкой либо другой части документа или другого ресурса (например, веб - страницы) , используя внешний URL - адрес . В качестве альтернативы (а иногда и одновременно) с установленными атрибутамиname
или id
HTML элемент становится целью ссылки. Унифицированный указатель информационного ресурса (URL) , можно связать с этой целью через идентификатор фрагмента . В HTML5 любой элемент теперь можно превратить в цель с помощью id
атрибута [27], поэтому в использовании нет необходимости, хотя этот способ добавления якорей продолжает работать.<a name="foo">...</a>
Для иллюстрации: заголовок раздела оглавления на example.com«домашние может быть превращены в мишень, написав: .<h2><a name="contents">Table of contents</a></h2>
Продолжая этот пример, теперь, когда раздел был помечен как целевой, на него можно ссылаться с внешних сайтов с помощью ссылки, например :;<a href="http://example.com#contents">see contents</a>
или со ссылкой на той же странице , как: .<a href="#contents">contents, above</a>
Атрибут title
может быть установлен , чтобы дать краткую информацию о ссылке: .<a href="URL" title="additional information">link text</a>
В большинстве графических браузеров при наведении курсора на ссылку он превращается в руку с вытянутым указательным пальцем, а title
значение отображается во всплывающей подсказке или каким-либо другим способом. Некоторые браузеры отображают замещающий текст таким же образом, хотя спецификация не требует этого.
A
существовал в тегах HTML и был стандартизирован в HTML 2.0 ;Элементы фраз используются для разметки фраз и добавления структуры или семантического значения к фрагментам текста. Например, <em>
и <strong>
метки могут быть использованы для добавления внимание к тексту.
<abbr>...</abbr>
<abbr title="abbreviation">abbr.</abbr>
<acronym>...</acronym> (deprecated)
<abbr>
<acronym title="Hyper-Text Mark-up Language">HTML</acronym>
abbr
тег. [28]<dfn>...</dfn>
DFN
существовал в HTML Internet Draft 1.2 и был полностью стандартизирован в HTML 3.2 ; все еще в силе.<em>...</em>
EM
существовал в HTML Internet Draft 1.2 и был стандартизирован в HTML 2.0 ; все еще в силе.<strong>...</strong>
STRONG
существовал в HTML Internet Draft 1.2 и был стандартизирован в HTML 2.0 ; все еще актуален, переопределен в HTML5.Эти элементы полезны в первую очередь для документирования разработки компьютерного кода и взаимодействия с пользователем посредством различения исходного кода ( ), переменных ( ), пользовательского ввода ( ) и терминала или другого вывода ( ).<code>
<var>
<kbd>
<samp>
<code>...</code>
code example
). Обычно отображается однотонным шрифтом.CODE
существовал в HTML Internet Draft 1.2 и был стандартизирован в HTML 2.0 ; все еще в силе.<kbd>...</kbd>
KBD
существовал в HTML Internet Draft 1.2 и был стандартизирован в HTML 2.0 ; все еще в силе.<samp>...</samp>
SAMP
существовал в HTML Internet Draft 1.2 и был стандартизирован в HTML 2.0 ; все еще в силе.<var>...</var>
VAR
существовал в HTML Internet Draft 1.2 и был стандартизирован в HTML 2.0 ; все еще в силе.Поскольку визуальная презентационная разметка применяется только к визуальным браузерам, ее использование не рекомендуется. Вместо этого следует использовать таблицы стилей. Некоторые из этих элементов являются устаревшими или недопустимыми в HTML 4 / XHTML 1.0, а остальные недопустимы в текущем проекте XHTML 2.0 . Нынешний проект HTML5 , однако, вновь включает в себя <s>
, <u>
и <small>
, назначив новое смысловое значение для каждого из них. В документе HTML5 использование этих элементов больше не приветствуется при условии, что они семантически корректны.
<b>...</b>
{ font-weight: bold; }
<strong>
<b>
<strong>
B
существовал в HTML Internet Draft 1.2 и был стандартизирован в HTML 2.0 ; все еще актуален, переопределен в HTML5.<i>...</i>
{ font-style: italic; }
<em>...</em>
<i>
<em>
I
существовал в HTML Internet Draft 1.2 и был стандартизирован в HTML 2.0 ; все еще актуален, переопределен в HTML5.<u>...</u>
{ text-decoration: underline; }
<u>
<u>
U
существовал в HTML Internet Draft 1.2 , был стандартизирован в HTML 3.2, но был объявлен устаревшим в HTML 4.0 Transitional и был недопустимым в HTML 4.0 Strict . Вновь введен в HTML5 .<small>...</small>
{ font-size: smaller; }
<small>
<aside>...</aside>
<s>...</s>
<strike>
. В HTML5 этот <s>
элемент обозначает информацию, которая «больше не является точной или более не актуальной», и не следует путать с ней <del>
, которая указывает на удаление / удаление. [33]S
был устаревшим в HTML 4.0 Transitional (то , не появился в любом предыдущем стандарте), и был неверен в HTML 4.0 Strict . Вновь введен в HTML5 , который вместо этого устарел <strike>
.<big>...</big> (deprecated)
{ font-size: larger; }
<strike>...</strike> (deprecated)
{ text-decoration: line-through; }
STRIKE
был стандартизирован в HTML 3.2 ; устарело в HTML 4.0 Transitional ; недействителен в HTML 4.0 Strict .<tt>...</tt> (deprecated)
{ font-family: monospace; }
TT
существовал в HTML Internet Draft 1.2 и был стандартизирован в HTML 2.0 ; не поддерживается [34] в HTML5. Возможные замены: <kbd>для маркировки пользовательского ввода, <var>для переменных (обычно отображаются курсивом, а не с изменением на моноширинный), <code>для исходного кода, <samp>для вывода. [34]<font>...</font> (deprecated)
<font [color=<var>color</var>] [size=<var>size</var>] [face=<var>face</var>]>...</font>
Можно указать цвет шрифта с color
атрибутом (обратите внимание на американское написание), шрифт с face
атрибутом и абсолютный или относительный размер с size
атрибутом. Примеры (все виды использования устарели, по возможности используйте эквиваленты CSS):<font color="green">text</font>
создает зеленый текст .<font color="#114499">text</font>
создает текст шестнадцатеричного цвета # 114499 .<font size="4">text</font>
создает текст размером 4. Размеры от 1 до 7. Стандартный размер - 3, если иное не указано в теге <body> или других тегах.<font size="+1">text</font>
создает текст размером на 1 больше стандартного. наоборот.<font size="-1">text</font>
<font face="Courier">text</font>
делает текст шрифтом Courier.<font size="N">
соответствует (спецификация HTML не определяет отношения между размером N и размером блока Y , а также не определяет единицу).{font-size: Yunits}
<font color="red">
соответствует { color: red; }
<font face="Times New Roman">
соответствует - CSS поддерживает стек шрифтов из двух или более альтернативных шрифтов.{ font-family: 'Times New Roman', Times, serif; }
<span>...</span>
<br />
<bdi>...</bdi>
<bdo>...</bdo>
<cite>...</cite>
<cite>
для «цитирования или ссылки на другие источники» без каких-либо особых ограничений или требований. [36] Спецификация W3C HTML 5 использует уточнение этой идеи, отражая, как элемент исторически использовался, но теперь требует, чтобы он содержал (но не ограничивался) по крайней мере одно из «заголовка работы или имени автора (человека, людей или организации) или ссылки URL, или ссылки в сокращенной форме в соответствии с соглашениями, используемыми для добавления метаданных цитирования ". [37]Но спецификация WHATWG разрешает использовать элемент только вокруг названия работы. [38] Спецификации W3C начинались с более широкого определения, а затем переключились на очень узкое после того, как WHATWG внесла это изменение. Однако в 2012 году W3C отменил собственное изменение в ответ на негативные отзывы сообщества разработчиков; этот элемент широко использовался с более широким охватом, например, различные платформы блогов и форумов помещают идентификаторы комментаторов и адреса электронной почты в<cite>...</cite>
, и люди, использующие этот элемент для библиографических ссылок, обычно помещали (и продолжают) обертывать в этот элемент каждую цитату целиком. Другая проблема с элементом заключается в том, что WHATWG рекомендует выделять его курсивом по умолчанию (таким образом, почти все браузеры делают это), потому что он (с их точки зрения) предназначен только для заголовков публикаций. Однако по соглашению курсивом выделяются только некоторые виды заголовков, в то время как другие должны быть заключены в кавычки, а стандарты могут фактически различаться в зависимости от контекста публикации и языка. Следовательно, многие авторы и администраторы веб-сайтов используют таблицу стилей для всего сайта, чтобы отменить автоматический курсив этого элемента.<data>...</data>
<del>...</del>
<ins>...</ins>
<del>
или <s>
. Обычно отображается подчеркнутым :Вставленный текст.<ins>
и <del>
также могут использоваться как блочные элементы: содержащие другие блочные и встроенные элементы. Однако эти элементы должны по-прежнему полностью оставаться в пределах своего родительского элемента, чтобы поддерживать правильно сформированный HTML-документ. Например, удаление текста из середины одного абзаца через несколько других абзацев и завершение последнего абзаца потребует использования трех отдельных <del>
элементов. Два <del>
элемента потребуются как встроенные элементы, чтобы указать удаление текста в первом и последнем абзацах, и третий, используемый в качестве блочного элемента, чтобы указать удаление в промежуточных абзацах.<mark>...</mark>
<q>...</q>
<blockquote>
<q>
cite
block-quote
) с использованием таблиц стилей. Например, с подходящим правилом CSS, связанным с q.lengthy
:<q>Lengthy quote here.</q >
<rb>...</rb>
<rp>...</rp>
<rt>...</rt>
<rtc>...</rtc>
<ruby>...</ruby>
<script>...</script>
<script>
сам по себе не является ни блоком, ни встроенным элементом; сам по себе он не должен отображаться вообще, но может содержать инструкции для динамической генерации как блочного, так и встроенного контента.<sub>...</sub>
<sup>...</sup>
{ vertical-align: sub; }
{ vertical-align: super; }
<template>...</template>
<time>...</time>
<wbr />
<applet>...</applet> (deprecated)
<object>
, поскольку его можно было использовать только с Java-апплетами и были ограничения доступности.<object>
несовместимы между различными браузерами.<area />
<map>
.<audio>...</audio>
src
атрибута. Поддерживаемые аудиоформаты варьируются от браузера к браузеру.<canvas>...</canvas>
<embed>...</embed>
<object>
, но затем было добавлено обратно в спецификацию HTML5 [46] [47]<img />
src
Атрибут определяет URL изображения. Обязательный altатрибут предоставляет альтернативный текст на случай, если изображение не может быть отображено. [48] (Хотя alt
это и задумано как альтернативный текст, Microsoft Internet Explorer 7 и ниже отображают его как всплывающую подсказку, если не title
указан атрибут. [49] Safari и Google Chrome , с другой стороны, не отображают атрибут alt вообще. ) [50]<img />
элемент был впервые предложен Марк Андреессена и реализован в NSCA Mosaic веб - браузер.[51]IMG
существовал в HTML Internet Draft 1.2 и был стандартизирован в HTML 2.0 ; все еще в силе.<map>...</map>
<object>...</object>
type
атрибутом. Это может быть любой MIME- тип, понятный пользовательскому агенту, например, встроенная HTML-страница, файл, который должен обрабатываться плагином, например Flash , Java- апплет , звуковой файл и т. Д.<param />
<applet>
, этот элемент теперь используется с <object>
и должен встречаться только как дочерний элемент <object>
. Он использует атрибуты HTML для установки параметра для объекта, например ширины, высоты, шрифта, цвета фона и т. Д., В зависимости от типа объекта. У объекта может быть несколько <param />
элементов.<source>...</source>
src
атрибут аналогично к <video>
и <audio>
элементов.<track>...</track>
<video>...</video>
src
атрибута. Поддерживаемые форматы видео различаются от браузера к браузеру.Эти элементы могут быть объединены в форму или в некоторых случаях использованы отдельно в качестве элементов управления пользовательского интерфейса; в документе они могут быть простыми HTML или использоваться вместе со скриптами. Разметка HTML определяет элементы, составляющие форму, и метод, с помощью которого она будет отправлена. Однако для обработки вводимых пользователем данных после их отправки необходимо использовать некоторые формы сценариев ( серверные , клиентские или и то, и другое).
(Эти элементы являются либо блочными, либо встроенными, но здесь собраны, поскольку их использование более ограничено, чем другие встроенные или блочные элементы.)
<form action="url">...</form>
<form>
элементе определяет и управляет общим действием в виде области, используя требуемый action
атрибут.<button>...</button>
<datalist>...</datalist>
option
s для использования в элементах формы.<fieldset>...</fieldset>
<fieldset>
, который затем может быть <legend>
добавлен для определения их функции.<input />
<input>
Элементы позволяют реализовать множество стандартных элементов управления формой.<button>
является предпочтительным, если это возможно (т. Е. Если клиент поддерживает его), поскольку он предоставляет более широкие возможности.src
атрибута.size
Атрибут определяет ширину по умолчанию ввода в символьных ширины. max-length
устанавливает максимальное количество символов, которое может ввести пользователь (которое может быть больше размера).text
которого создает панель поиска.text
. Разница в том, что текст, вводимый в это поле, замаскирован - символы отображаются в виде звездочки, точки или другой замены. Пароль по-прежнему отправляется на сервер в виде открытого текста , поэтому необходим базовый протокол защищенной связи, такой как HTTPS, если конфиденциальность является проблемой.text
для телефонных номеров .text
для адресов электронной почты .text
для URL .text
для номера.hidden
входные данные не видны на отображаемой странице, но позволяют дизайнеру поддерживать копию данных, которые необходимо отправить на сервер как часть формы. Это могут быть, например, данные, которые этот веб-пользователь ввел или выбрал в предыдущей форме, которые необходимо обработать вместе с текущей формой. Не отображается для пользователя, но данные могут быть изменены на стороне клиента путем редактирования источника HTML.<isindex /> (deprecated)
<isindex />
может появляться либо в заголовке документа, либо в теле, но только один раз в документе.<isindex />
работает как примитивная форма поиска HTML; но де-факто был устаревшим из-за более продвинутых HTML-форм, представленных в начале и середине 1990-х годов. Представляет набор гиперссылок, состоящий из базового URI, амперсанда и ключевых слов с процентной кодировкой, разделенных знаками плюс .ISINDEX
существовал в тегах HTML ; стандартизирован в HTML 2.0 ; устарело в HTML 4.0 Transitional ; недействителен в HTML 4.0 Strict .<keygen>...</keygen> (deprecated)
<label for="id">...</label>
radio
. Щелчок по метке вызывает щелчок по соответствующему входу.<legend>...</legend>
<fieldset>
.<meter>...</meter>
value
атрибут. Можно также: min
, low
, high
, и max
.<option value="x">...</option>
<select>
списке.<optgroup>...</optgroup>
<option>
элементов в <select>
списке.<output>...</output>
<progress>...</progress>
<select name="xyz">...</select>
<textarea rows="8">...</textarea>
cols
(где столбец - это односимвольный текст) и rows
атрибутами HTML . Содержимое этого элемента ограничено обычным текстом, который отображается в текстовой области как текст по умолчанию при загрузке страницы.Формат таблиц HTML был предложен в черновиках HTML 3.0 и более поздних HTML-таблицах RFC 1942 . Они были вдохновлены табличной моделью CALS . Некоторые элементы этих предложений были включены в HTML 3.2; нынешняя форма таблиц HTML была стандартизирована в HTML 4. (Многие элементы, используемые в таблицах, не являются ни блочными, ни встроенными элементами).
<table>...</table>
summary
Атрибут неформально требуется для целей доступности, хотя его использование не является простым.<tr>...</tr>
<table>
.<th>...</th>
<table>
Ячейки заголовка; содержимое обычно отображается жирным шрифтом и по центру. Звуковой агент пользователя может использовать более громкий голос для этих элементов.<td>...</td>
<table>
Ячейка данных.<colgroup>...</colgroup>
<table>
.<col>...</col>
<table>
.<table>
.<thead>...</thead>
<table>
. Этот раздел может повторяться пользовательским агентом, если таблица разбита по страницам (при печати или других страничных носителях).<tbody>...</tbody>
<table>
.<tfoot>...</tfoot>
<table>
. Подобно <thead>
этому, этот раздел может повторяться пользовательским агентом, если таблица разбита по страницам (при печати или других страничных носителях).Фреймы позволяют разделить визуальное окно HTML-браузера на сегменты, каждый из которых может отображать отдельный документ. Это может снизить использование полосы пропускания, поскольку повторяющиеся части макета могут использоваться в одном кадре, а переменное содержимое отображается в другом. Это может иметь определенную стоимость удобства использования, особенно в невизуальных пользовательских агентах [52] из-за того, что отдельные и независимые документы (или веб-сайты) отображаются рядом друг с другом и им разрешено взаимодействовать с одним и тем же родительским окном. Из-за этой стоимости фреймы (за исключением <iframe>
элемента) разрешены только в HTML 4.01 Frame-set. Iframe также может хранить документы на разных серверах. В этом случае взаимодействие между окнами блокируется браузером. Такие сайты, как Facebook и Twitterиспользовать iframe для отображения контента (плагинов) на сторонних веб-сайтах. Google AdSense использует iframe для отображения баннеров на сторонних веб-сайтах.
В HTML 4.01 документ может содержать a <head>
и a <body>
или a <head>
и a <frameset>
, но не одновременно a <body>
и a <frameset>
. Однако <iframe>
может использоваться в обычном теле документа.
<frameset>...</frameset> (deprecated)
<frame />
элементов для документа. Расположение фреймов задается списками, разделенными запятыми, в атрибутахrows
и cols
HTML .<frame /> (deprecated)
<frameset>
. Отдельный документ связывается с фреймом с помощью src
атрибута внутри <frame />
элемента.<noframes>...</noframes> (deprecated)
<frame />
элементы.<iframe>...</iframe>
<object />
элемента, он <iframe>
может быть «целевым» фреймом для ссылок, определенных другими элементами, и он может быть выбран пользовательским агентом в качестве фокуса для печати, просмотра его источника и т. Д. Содержимое элемента используется в качестве альтернативного текста для отображения, если браузер не поддерживает встроенные фреймы.longdesc
атрибутВ HTML , longdesc
это атрибут , используемый в пределах <img />
, <frame />
или <iframe>
элементов. Предполагается, что это URL-адрес [примечание 5] к документу, который предоставляет подробное описание для рассматриваемого изображения, фрейма или iframe. [53] Обратите внимание, что этот атрибут должен содержать URL-адрес, а не - как обычно ошибочно - текст самого описания.
longdesc
был разработан для использования программами чтения с экрана для отображения информации об изображениях для пользователей компьютеров с ограниченными возможностями , таких как слепые или слабовидящие, и широко применяется как в веб-браузерах, так и в программах чтения с экрана. [54] Некоторые разработчики возражают, что [55] он на самом деле редко используется для этой цели, потому что сравнительно немного авторов используют этот атрибут, и большинство из них используют его неправильно; таким образом, они рекомендуют отказаться от использования longdesc
. [56] Издательская индустрия отреагировала, выступая за сохранение longdesc
. [57]
< img src = "Hello.jpg" longdesc = "description.html" >
Содержание description.html
:
< Бр /> < р > Это образ двухслойного торт ко дню рождения. </ p >...
Поскольку очень немногие графические браузеры поддерживают доступность ссылки изначально (за исключением Opera и iCab), полезно по возможности включать ссылку на страницу описания рядом с <img />
элементом, поскольку это также может помочь зрячим пользователям.
< IMG SRC = "Hello.jpg" longdesc = "description.html" /> [ < HREF = "description.html" название = "длинное описание изображения" > D </ > ]
Следующие элементы были частью раннего HTML, разработанного Тимом Бернерсом-Ли с 1989 по 1991 год; они упоминаются в тегах HTML , но устарели в HTML 2.0 и никогда не были частью стандартов HTML.
<listing>...</listing> (deprecated)
<plaintext /> (deprecated)
<plaintext />
не имеет конечного тега, поскольку он завершает разметку и вызывает анализ остальной части документа, как если бы это был открытый текст .<plaintext />
существовал в тегах HTML ; устарело в HTML 2.0 ; недействителен в HTML 4.0 .<xmp>...</xmp> (deprecated)
<nextid /> (deprecated)
<nextid />
существовали в HTML-тегах (описаны как устаревшие); устарело в HTML 2.0 ; недействителен в HTML 3.2 и новее.В этом разделе перечислены некоторые широко используемые устаревшие элементы, что означает, что они не используются в допустимом коде. Они могут поддерживаться не всеми пользовательскими агентами.
<blink>...</blink> (deprecated)
{text-decoration: blink}
<blink>
возникла в Netscape Navigator и в основном признана его потомками, включая Firefox ; устарело или недействительно в HTML 2.0 и более поздних версиях. Обратите внимание, что заменяющий тег CSS, хотя и является стандартным, не требует поддержки.<layer>...</layer> (deprecated)
<layer>
возник в Netscape 4 ; устарело или недействительно в HTML 4.01 и более поздних версиях.<marquee>...</marquee> (deprecated)
<marquee>
возник в Microsoft Internet Explorer ; устарело или недействительно в HTML 4.01 и более поздних версиях.<nobr>...</nobr> (deprecated)
{white-space: nowrap;}
<nobr>
является проприетарным элементом, который распознается большинством браузеров по соображениям совместимости; устарело или недействительно в HTML 2.0 и более поздних версиях.<noembed>...</noembed> (deprecated)
<embed>
<object>
<!-- A Comment -->
Комментарий в HTML (и связанных с XML, SGML и SHTML) использует тот же синтаксис, что и комментарий SGML или XML комментарий , в зависимости от DOCTYPE.
В отличие от большинства тегов HTML, комментарии не вкладываются.
Разметка <!--Xbegin<!--Y-->Xend-->
даст комментарийXbegin <! - Y и текст Xend -> после этого, а иногда просто Xend ->, в зависимости от браузера.
Комментарии могут появляться в любом месте документа, поскольку парсер HTML должен игнорировать их независимо от того, где они появляются, если они не находятся внутри других структур тегов HTML (т. Е. Их нельзя использовать рядом с атрибутами и значениями; это недопустимая разметка :) .<span id="x1"<--for "extension one"--> style="..."<
Комментарии могут появляться даже перед объявлением doctype; никакие другие теги не могут этого сделать.
Однако не все браузеры и редакторы HTML полностью совместимы со структурой синтаксиса HTML и могут делать непредсказуемые вещи при некоторых условиях синтаксиса. Некорректная обработка комментариев затрагивает только около 5% всех используемых браузеров и редакторов HTML, и даже тогда только определенные версии подвержены ошибкам с комментариями (большая часть этого высокого процента приходится на Internet Explorer 6).
Есть несколько причуд совместимости, связанных с комментариями:
doctype
знаком заставит Internet Explorer 6 использовать режим причуд для HTML-страницы. Никакая doctype
информация не будет обработана.<style>
и <script>
элементы по-прежнему иногда окружены разделителями комментариев, а браузеры с поддержкой CSS и сценариев написаны таким образом, чтобы специально игнорировать эту разметку комментария как фактически не комментарий. Это означает, что попытки фактически закомментировать CSS и разметку скрипта, изменив элементы внутри комментария, чтобы они не распознавались, например .<-- [script]...[/script] -->
<style> ... {comment tags} ...</style>
<object>
<embed>
<embed>
... фреймы действительно создают дополнительные проблемы с удобством использования, которые характерны только для пользователей с ограниченными возможностями, особенно для тех, кто использует программы чтения с экрана.
В Wikibook HyperText Markup Language есть страница по теме: все элементы в HTML |