Просмотр кода страницы Элементы HTML

{{значения2|Эта статья посвящена в основном элементам [[HTML]]. Чтобы узнать о формате элементов [[Википедия|Википедии]], см. [[Википедия:Как редактировать статью]] и [[m:Help:HTML in wikitext/ru]]}}
{{HTML}}

'''Элемент HTML''' — основная структурная единица [[веб-страница|веб-страницы]], написанная на языке [[HTML]]. Элементы можно увидеть в исходном коде всех веб-страниц после задания типа документа. <code><!DOCTYPE></code> определяет, какую версию ([[XHTML|X]])HTML использует страница. Элементы страницы находятся между открывающим тегом <code><html></code> и закрывающим <code></html></code>. Элемент <code><html></code> называется ''корневым элементом''.<ref name="Tepllo">[https://developer.mozilla.org/ru/docs/Web/HTML/Element Корневой элемент HTML-документа] {{Wayback|url=https://developer.mozilla.org/ru/docs/Web/HTML/Element|date=20191220194750}}</ref> 
<!--
* Описание HTML-элементов (синтаксис)
* Классификация HTML-элементов
** Логические и презентационные элементы HTML
** Элементы HTML по умолчательному представлению (блочные, строчные и т. д.)
** Нерекомендуемые HTML-элементы
* Группы HTML-элементов
** Текст
** Списки
** Таблицы
** Формы
-->

== Структура HTML-документа ==
[[HTML]] — это [[Тег (языки разметки)|теговый]] [[язык разметки]] документов, то есть любой документ на языке HTML представляет собой набор элементов, причём начало и конец каждого элемента обозначается специальными пометками, называемыми [[тег (языки разметки)|тегами]]. Регистр, в котором набрано имя тега, в HTML значения не имеет. Элементы могут быть ''пустыми'', то есть не содержащими никакого текста и других данных (например, тег перевода строки '''<nowiki><br></nowiki>'''). В этом случае обычно не указывается закрывающий тег. Кроме того, элементы могут иметь ''[[HTML-атрибут|атрибуты]]'', определяющие какие-либо их свойства (например, размер шрифта для тега '''<nowiki><font></nowiki>'''). Атрибуты указываются в открывающем теге. Вот пример части разметки HTML-документа:
<source lang="html4strict"><p>Текст между двумя тегами - открывающим и закрывающим.</p>
 <a href="http://example.com">Здесь элемент содержит атрибут href.</a>
А вот пример пустого элемента: <br></source>

Каждый HTML-документ, отвечающий спецификации HTML какой-либо версии, обязан начинаться со строки декларации версии HTML <!DOCTYPE>, которая обычно выглядит примерно так:
<source lang="html4strict"><!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"></source>
Если эта строка не указана, то добиться корректного отображения документа в [[браузер]]е становится труднее.

Далее обозначается начало и конец документа тегами <code><html></code> и <code></html></code> соответственно.
Внутри этих тегов должны находиться теги заголовка (<code><head></head></code>) и тела (<code><body></body></code>) документа.

=== Варианты DOCTYPE для HTML 4.01 ===
* Строгий (Strict): не содержит тегов, помеченных как «устаревшие» или «не одобряемые» (deprecated).
<source lang="html4strict"><!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"></source>
* Переходный (Transitional): содержит устаревшие теги в целях совместимости и упрощения перехода со старых версий HTML.
<source lang="html4strict"><!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"></source>
* С [[Фрейм (HTML)|фреймами]] (Frameset): аналогичен переходному, но содержит также теги для создания наборов фреймов.
<source lang="html4strict"><!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd"></source>

=== DOCTYPE для HTML 5 ===
В отличие от предыдущих версий тег всего один.<ref>{{Cite web|url=https://html.spec.whatwg.org/multipage/syntax.html#the-doctype|title=HTML Standard|website=html.spec.whatwg.org|access-date=2021-09-26|archive-date=2021-09-26|archive-url=https://web.archive.org/web/20210926104129/https://html.spec.whatwg.org/multipage/syntax.html#the-doctype|url-status=live}}</ref>

<source lang="html4strict"><!DOCTYPE html></source>

== Основные элементы ==
{{main|Тег (языки разметки)}}
[[File:HTML element content categories.svg|thumb|HTML element content categories]]
Теги и их параметры нечувствительны к регистру. То есть <nowiki>&lt;A HREF="http://example.com"></nowiki> и <nowiki>&lt;a href="http://example.com"></nowiki> означают одно и то же.

В последних версиях HTML практически у каждого тега огромное число необязательных параметров — обычно не меньше 15. Мы приводим только основные параметры тегов.

=== Гиперссылки ===
<source lang="html4strict"><a href="filename" target="_self">название ссылки</a></source>
* Атрибут <code>href</code> задаёт значение адреса документа, на который указывает ссылка.
* <code>filename</code> — имя файла или адрес Internet, на который необходимо сослаться.
* <code>название ссылки</code> — название гипертекстовой ссылки, которое будет отображаться в браузере, то есть показываться тем, кто зашёл на страницу.
* <code>target</code> — задаёт значение окна или фрейма, в котором будет открыт документ, на который указывает ссылка. Возможные значения атрибута:
** <code>_top</code> — открытие документа в текущем окне;
** <code>_blank</code> — открытие документа в новом окне;
** <code>_self</code> — открытие документа в текущем фрейме;
** <code>_parent</code> — открытие документа в родительском фрейме.
Значение по умолчанию: <code>_self</code>.

==== Якорь ====
Тот же элемент используется для создания так называемых «якорей» (anchor), которые могут потом использоваться в гиперссылках, направленных на какой-то определённый элемент страницы. Например:

<source lang="html5">
<!DOCTYPE html> 
 <html>
  <head>
    <meta charset="utf-8">
    <title>Якорь внутри документа</title>
  </head>
  <body>
   <p><a name="top"></a></p>
   <p>текст</p>
   <p><a href="#top">Наверх</a></p>
  </body>
</html>
</source>

Аналогичным образом якорь можно сделать на закладку, находящуюся на другой веб-странице или на другом сайте: там, куда направлена ссылка, должен стоять <code>&lt;a name="xxx"></a></code>, а там, откуда идёт ссылка, к значению <code>href</code> добавляется [[знак решётки]] ('''#''') и название якоря.

Также якорем в современных браузерах может служить id любого элемента.

=== Текстовые блоки ===
* <code>&lt;h1> … &lt;/h1></code>, <code>&lt;h2> … &lt;/h2></code>, … ,<code>&lt;h6> … &lt;/h6></code> — заголовки 1, 2, … 6 уровня. Используются для выделения частей текста (заголовок 1 — самый крупный, 6 — самый мелкий).
* <code>&lt;p></code> — новый абзац. Можно в конце абзаца поставить <code>&lt;/P></code>, но это не обязательно.
* <code>&lt;br></code> — новая строка. Этот тег не закрывается (то есть не существует тега <code>&lt;/BR></code>)
* <code>&lt;hr></code> — горизонтальная линия
* <code>&lt;blockquote> … &lt;/blockquote> </code> — цитата. Обычно текст сдвигается вправо.
* <code>&lt;pre> … &lt;/pre> </code> — режим preview (preformatted text). Пробельные символы остаются там, где они есть в оригинальном документе (в других тегах игнорируются). Внутри могут обрабатываться внутристроковые теги кроме img, object, big, small, sup и sub.
* <code>&lt;div> … &lt;/div> </code> — блок (обычно используется для применения стилей [[CSS]])
* <code>&lt;span> … &lt;/span> </code> — строка (обычно используется для применения стилей [[CSS]])

=== Форматирование текста ===
* <code>&lt;em> … &lt;/em> </code> — логическое ударение (обычно отображается ''курсивным шрифтом'')
* <code>&lt;strong> … &lt;/strong> </code> — усиленное логическое ударение (обычно отображается '''жирным шрифтом''')
* <code>&lt;i> … &lt;/i> </code> — выделение текста ''курсивом.'' Важно, что <nowiki>'' и ''' не являются семантическими тегами, то есть не придают смысла содержимому.</nowiki><ref>{{Cite web|url=https://htmlacademy.ru/blog/html/semantics|title=Что такое семантическая вёрстка и зачем она нужна — журнал «Доктайп»|lang=ru|website=HTML Academy|access-date=2023-08-30|archive-date=2023-08-30|archive-url=https://web.archive.org/web/20230830075802/https://htmlacademy.ru/blog/html/semantics|url-status=live}}</ref>
* <code>&lt;b> … &lt;/b> </code> — выделение текста '''жирным шрифтом'''
* <code>&lt;u> … &lt;/u> </code> — <u>подчёркивание</u> текста
* <code>&lt;s> … &lt;/s> </code> (или <code>&lt;strike> … &lt;/strike> </code>)— <s>зачёркивание</s> текста
*<code>&lt;big> … &lt;/big> </code> — <big>увеличение шрифта. Устарел и не рекомендуется к использованию</big><ref>{{Cite web|url=https://htmlacademy.ru/blog/html-tags/big|title=— журнал «Доктайп»|lang=ru|website=HTML Academy|access-date=2023-08-30|archive-date=2023-08-30|archive-url=https://web.archive.org/web/20230830072801/https://htmlacademy.ru/blog/html-tags/big|url-status=live}}</ref><big>.</big>
* <code>&lt;small> … &lt;/small> </code> — <small>уменьшение шрифта</small>
* <code>&lt;blink> … &lt;/blink> </code> — мигающий текст. Внимание! Этот тег не работает в [[браузер]]е [[Internet Explorer]] версий 5 и ниже без применения [[JavaScript]]
* <code>&lt;marquee> … &lt;/marquee> </code> — сдвигающийся по экрану текст.
* <code>&lt;sub> … &lt;/sub> </code> — подстрочный текст. Например, <code>H&lt;SUB>2&lt;/SUB>O</code>  создаст текст H<sub>2</sub>O.
* <code>&lt;sup> … &lt;/sup> </code> — надстрочный текст. Например, <code>E=mc&lt;SUP>2&lt;/SUP></code>  создаст текст E=mc<sup>2</sup>.
* <code>&lt;font ''параметры''> … &lt;/font> </code> — устаревший тег<ref>{{Cite web|url=https://htmlacademy.ru/blog/html-tags/font|title=— журнал «Доктайп»|lang=ru|website=HTML Academy|access-date=2023-08-30|archive-date=2023-08-30|archive-url=https://web.archive.org/web/20230830075800/https://htmlacademy.ru/blog/html-tags/font|url-status=live}}</ref>, отвечавший за задание параметров шрифта. У этого тега есть следующие параметры:
** <code>color=''цвет''</code> — задание цвета. Цвет может быть задан в шестнадцатеричной форме как #rrggbb (первые 2 шестнадцатеричные цифры задают красную компоненту, следующие 2 — зелёную, последние 2 — синюю) или названием.
** <code>face=''шрифт''</code> задание [[гарнитура (типографика)|гарнитуры]] шрифта
** <code>size=''размер''</code> задание размера шрифта. Размер от 1 до 7: стандартный по умолчанию 3. Есть много способов изменить стандартный размер.
** <code>size=+''изменение''</code> или <code>size=-''изменение''</code> — изменение размера шрифта от стандартного. Например, +2 означает размер на 2 больше стандартного.
Например,
<source lang="html4strict">
Сигналом к началу атаки являются
<U>три</U> <FONT SIZE="+2">больших</FONT> <FONT COLOR="green">зелёных</FONT> свистка.
</source>
создаст текст
: <code>Сигналом к началу атаки являются <U>три</U> <FONT size="+2">больших</FONT> <FONT color="green">зелёных</FONT> свистка.</code>

=== Списки ===
<source lang="html4strict">
 <UL>
   <LI> первый элемент </LI>
   <LI> второй элемент </LI>
   <LI> третий элемент </LI>
 </UL>
</source>
создаёт список
* первый элемент
* второй элемент
* третий элемент

Если вместо <code>&lt;ul></code> ({{lang-en2|Unordered List}} — ненумерованный список) поставить <code>&lt;ol></code> ({{lang-en2|Ordered List}} — нумерованный список), список получится нумерованным:
# первый элемент
# второй элемент
# третий элемент

У этих тегов есть параметры:
 '''type''' = "тип" 
где ''тип'' — форма:

в <code> &lt;UL> </code> — символов

* <code>square</code> — квадрат
* <code>circle</code> — окружность
* <code>disk</code> — круг: по умолчанию

а в <code> &lt;OL> </code> — цифр или букв

* A или а (латинскими буквами) — буквенный список: соответственно заглавными или строчными буквами
* I или i — римские цифры: соответственно заглавными или строчными буквами (римскими цифрами отображаются числа с 1 по 3999, остальные — арабскими)
* 1 — арабские цифры: по умолчанию

пишется так:
<source lang="html4strict">
<ol type="i">
  <li> Первое </li>
  <li> Второе </li>
  <li> И т.д. </li>
</ol>
</source>
и создаст следующее:
<blockquote>
<ol type="i">
<li> Первое </li>
<li> Второе </li>
<li> И т. д. </li>
</ol>
</blockquote>

Параметр '''start'''=<nowiki>"начало"</nowiki> (только для <code> &lt;OL> </code>), определяющий начало нового отсчёта: например, если нужно не 1, 2, 3, а 24, 25, 26

Пишется так:
<source lang="html4strict">
<ol start="24">

<li> Двадцать четыре </li>

<li> Двадцать пять </li>

<li> И т.д. </li>
</source>
и создаст следующее:
<blockquote>
<ol start="24">
<li> Двадцать четыре </li>
<li> Двадцать пять </li>
<li> И т. д. </li>
</ol>
</blockquote>

и, наконец для тега <code> &lt;LI> </code> параметр '''<code>value</code>'''<code>=<nowiki>"следующий"</nowiki></code> — если необходимо перескочить с одной цифры на другую: например, не 1, 2, 3, 4, а 1, 2, 22, 23
<source lang="html4strict">
<ol>

<li> Один </li>

<li> Два </li>

<li value="22"> Двадцать два </li>

<li> Двадцать три </li>
</source>
создаст следующее:
<blockquote>
<ol>
<li> Один </li>
<li> Два </li>
<li value="22"> Двадцать два </li>
<li> Двадцать три </li>
</ol>
</blockquote>

Наконец, третьим, и последним, списком является ''список определений'':
<source lang="html4strict"> 
 <DL>
  <DT> Кошка </DT> <DD> мяукающее домашнее животное </DD>
  <DT> Кот </DT> <DD> муж кошки </DD>
  <DT> Крокодил </DT> <DD> большой африканский зверь с острыми зубами </DD>
 </DL>
</source>
создаст следующее:
<blockquote>
 <DL>
  <DT> Кошка </DT> <DD> мяукающее домашнее животное </DD>
  <DT> Кот </DT> <DD> муж кошки </DD>
  <DT> Крокодил </DT> <DD> большой африканский зверь с острыми зубами </DD>
 </DL>
</blockquote>

Между прочим, теги<code> &lt;LI></code>,<code> &lt;DT></code>,<code> &lt;DD></code> можно и не закрывать.

==== Различия в отображении нумерованных списков ====
При неположительных значениях в нумерации браузеры ведут себя по-разному. Например, [[Internet Explorer]] игнорирует <code>value=0</code>, <code>value=-1</code> и т.д., другие же браузеры, как [[Google Chrome|Chrome]], [[Mozilla Firefox|Firefox]], отображают заданное значение. При этом Internet Explorer не игнорирует <code>start=0</code>, <code>start=-1</code> и т.д., т.е. начать список с неположительного значения он может, но перескочить в нумерации на неположительное значение не может.
{|rules=all frame=void
!HTML-разметка||Данный браузер||Chrome, Firefox||Internet Explorer
|-
|<source><ol start=-2><li><li value=0><li value=2></ol></source>||<ol start=-2><li> <li value=0> <li value=2> ||-2, 0, 2||-2, -1, 2
|}
В буквенном списке (<code>type=A</code> или <code>type=a</code>) неположительные значения одни браузеры, как Chrome, Firefox, отображают цифрами, а Internet Explorer (в режиме [[Quirks mode]], т.е. если на странице не указана версия HTML 4.01 или 5 в тэге <code>!DOCTYPE HTML</code>) отрицательные значения отображает буквами со знаком “минус”, а ноль — символом @.
{|rules=all frame=void
!HTML-разметка||Данный браузер||Chrome, Firefox||Internet Explorer (Quirks mode)
|-
|<source><ol type=A start=-1><li><li><li></ol></source>||<ol type=A start=-1><li> <li> <li> ||-1, 0, A||-A, @, A
|}
Пустое или нечисловое значение (<code>value=</code>, <code>value=A</code>, <code>value=B</code>) одни браузеры, как Chrome, Firefox, игнорируют, а Internet Explorer воспринимает как <code>value=1</code>.
{|rules=all frame=void
!HTML-разметка||Данный браузер||Chrome, Firefox||Internet Explorer
|-
|<source><ol start=-2><li><li value=B><li value=2></ol></source>||<ol start=-2><li> <li value=B> <li value=2> ||-2, -1, 2||-2, 1, 2
|}
Имеются различия при отображении чисел римскими цифрами (<code>type=I</code> или <code>type=i</code>), т.к. Internet Explorer (в режиме [[Quirks mode]], т.е. если на странице не указана версия HTML 4.01 или 5 в тэге <code>!DOCTYPE HTML</code>) некоторые числа отображает неправильно.
{|rules=all frame=void
!HTML-разметка||Данный браузер||Chrome, Firefox||Internet Explorer (Quirks mode)
|-
|<source><ol type=I start=3300><li><li><li><li></ol></source>
|<ol type=I start=3300 style=margin-left:6em><li> <li> <li> <li> 
|MMMCCC<br>MMMCCCI<br>MMMCCCII<br>MMMCCCIII
|MMMCCC<br>MMMCCC<br>MMMCCC<br>MMMCCC
|}
Все числа из интервала с 1 по 1880 Internet Explorer отображает правильно, а из интервала с 1881 по 3999 — не все. Для 603 чисел, 67 групп по 9 чисел (xxx1—xxx9), в запись римскими цифрами не попадает младшая цифра. И это, скорее всего, не для того, чтобы укоротить длинную запись, т.к. 3888 — число с самой длинной (в интервале с 1 по 3999) записью римскими цифрами (MMMDCCCLXXXVIII) — отображается правильно.

В таблице крестиком отмечены группы неправильно отображаемых в Internet Explorer (в режиме [[Quirks mode]]) чисел:
{|rules=all frame=void
|||01-09||11-19||21-29||31-39||41-49||51-59||61-69||71-79||81-89||91-99
|-
|1800
!||||||||||||||||✘||
|-
|2300
!||||||✘||||||||✘||✘||
|-
|2700
!||||||✘||||||||✘||✘||
|-
|2800
!||✘||✘||✘||✘||✘||✘||✘||✘||✘
|-
|3100
!||||||||||||||||✘||
|-
|3200
!||||✘||✘||✘||||✘||✘||✘||✘
|-
|3300
!✘||✘||✘||✘||✘||✘||✘||✘||||✘
|-
|3400
!||||✘||✘||✘||||✘||✘||✘||✘
|-
|3500
!||||||||||||||||✘||
|-
|3600
!||||✘||✘||✘||||✘||✘||✘||✘
|-
|3700
!✘||✘||✘||✘||✘||✘||✘||✘||||✘
|-
|3800
!✘||✘||||||||✘||||||||
|-
|3900
!||||✘||✘||✘||||✘||✘||✘||✘
|}

=== Объекты ===
* <code>EMBED</code> — вставка различных объектов: не-HTML документов и media-файлов
* <code>APPLET</code> — вставка [[Java-апплет]]ов
* <code>SCRIPT</code> — вставка скриптов.

=== Изображения ===
* <code>IMG</code> — вставка изображения. Этот тег не закрывается.
** <code>SRC</code> — имя или URL
** <code>ALT</code> — альтернативное имя (отобразится, если в браузере запретить отображать картинки)
** <code>TITLE</code> — краткое описание изображения (отобразится при наведении курсора на картинку)
** <code>WIDTH</code>, <code>HEIGHT</code> — размеры (если не совпадают с истинными размерами картинки, то изображение «растянется» или «сожмётся»)
** <code>ALIGN</code> — задаёт параметры обтекания текстом (top, middle, bottom, left, right)
** <code>VSPACE</code>, <code>HSPACE</code> — задают размеры вертикального и горизонтального пространства вокруг изображения

Пример:
<source lang="html4strict">
<IMG SRC=url ALT="текст" TITLE="текст" WIDTH="размер (пикс, %)" HEIGHT="размер (пикс, %)">
</source>

Изображение можно сделать ссылкой:
<source lang="html4strict">
<A HREF=url ><IMG SRC=url></A> 
</source>

=== Карта изображений ===
{{main|Карта изображений}}
* '''<code><MAP>…</code><code></MAP></code>''' — создание [[Карта изображений|карты изображений]] позволяющей хранить в одном изображении несколько ссылок.
Пример:
<source lang="html4strict">
<IMG width="500" height="200" usemap="#somemap" src="url">
<MAP name="somemap">
    <AREA shape="rect" coords="6, 7, 140, 196" href="url1">
    <AREA shape="circle" coords="239, 98, 92" href="url2">
    <AREA shape="polygon" coords="386,16, 344,56, 350,189, 385,132, 489,190, 496,74" href="url3">
</MAP>
</source>

=== Таблицы ===
* <code>TABLE</code> — создание таблицы. Параметры тега:
** <code>BORDER</code> — толщина разделительных линий в таблице
** <code>CELLSPACING</code> — расстояние между клетками
** <code>CELLPADDING</code> — отступ от рамки до содержимого ячейки.
* <code>CAPTION</code> — заголовок таблицы (этот тег необязателен)
* <code>TR</code> — строка таблицы
* <code>TH</code> — заголовок столбца таблицы (этот тег необязателен)
* <code>TD</code> — ячейка таблицы
* <code>height</code> — высота таблицы
* <code>width</code> — ширина таблицы
Так, например,

<source lang="html4strict">
<TABLE BORDER="1" CELLSPACING="0">
  <CAPTION> Улов крокодилов в Мумбе-Юмбе </CAPTION>
  <TH> Год </TH> 
  <TH> Улов </TH>
  <TR>
    <TD> 1997 </TD> 
    <TD> 214 </TD>
  </TR>
  <TR>
    <TD> 1998 </TD> 
    <TD> 216 </TD>
  </TR>
  <TR>
    <TD> 1999 </TD> 
    <TD> 207 </TD>
  </TR>
</TABLE>
</source>

Создаст таблицу:

{{начало цитаты}}
<TABLE BORDER="1" CELLSPACING="0">
<CAPTION> Улов крокодилов в Мумбе-Юмбе </CAPTION>
<TH> Год </TH>
<TH> Улов </TH>
<TR>
<TD> 1997 </TD> <TD> 214 </TD>
</TR>
<TR>
<TD> 1998 </TD> <TD> 216 </TD>
</TR>
<TR>
<TD> 1999 </TD> <TD> 207 </TD>
</TR>
</TABLE>
{{конец цитаты}}

У тега TABLE есть ещё параметр CELLPADDING. Он определяет расстояние в пикселях между рамкой ячейки и её содержимым. Например, если заменить первую строку таблицы на
<source lang="html4strict"><TABLE BORDER="1" CELLSPACING="0" CELLPADDING="5"> </source>
таблица получится такой:

{{начало цитаты}}
<TABLE BORDER="1" CELLSPACING="0" CELLPADDING="5">
<CAPTION> Улов крокодилов в Мумбе-Юмбе </CAPTION>
<TH> Год </TH>
<TH> Улов </TH>
<TR>
<TD> 1997 </TD> <TD> 214 </TD>
</TR>
<TR>
<TD> 1998 </TD> <TD> 216 </TD>
</TR>
<TR>
<TD> 1999 </TD> <TD> 207 </TD>
</TR>
</TABLE>
{{конец цитаты}}

Другой параметр тегов <code>TABLE</code>, <code>TR</code>, <code>TH</code>, <code>TD</code> — <code>ALIGN</code>. Он определяет выравнивание. Возможные значения — <code>center</code> (по центру), <code>left</code> (по левому краю), <code>right</code> (по правому краю).

Параметр <code>ALIGN</code> в <code>TD</code> или <code>TH</code> определяет выравнивание для содержимого внутри данной ячейки, в <code>TR</code> — для содержимого всех ячеек строки, <code>TABLE</code> — для самой таблицы на страничке. Для каждой ячейки берётся выравнивание из <code>TD</code> или <code>TH</code>, если оно не задано — из <code>TR</code>, если и оно не задано — по центру для <code>TH</code> или по левому краю для <code>TD</code>.

Например, если заменить первые строки таблицы на
<source lang="html4strict">
<TABLE BORDER="1" CELLSPACING="0" ALIGN="center">
<CAPTION> Улов крокодилов в Мумбе-Юмбе </CAPTION>
<TH> Год </TH>
<TH> Улов </TH>
<TR>
<TD> 1997 </TD> <TD ALIGN="CENTER"> 214 </TD>
</source>
таблица получится такой:

{{начало цитаты}}
<TABLE BORDER="1" CELLSPACING="0" ALIGN="center">
<CAPTION> Улов крокодилов в Мумбе-Юмбе </CAPTION>
<TH> Год </TH>
<TH> Улов </TH>
<TR>
<TD> 1997 </TD> <TD ALIGN="CENTER"> 214 </TD>
</TR>
<TR>
<TD> 1998 </TD> <TD> 216 </TD>
</TR>
<TR>
<TD> 1999 </TD> <TD> 207 </TD>
</TR>
</TABLE>
{{конец цитаты}}

{{нет АИ 2|Незакрытые теги '''TD''', '''TR''' и '''TH''' приводят к некорректному отображению, особенно при работе со вложенными таблицами.|5|10|2019}} <!-- стандарт позволяет не закрывать эти теги, проблем не возникает -->

=== Формы ===
{{main|Форма (HTML)}}
Создание форм в HTML является довольно сложным делом. Здесь приводятся только названия основных тегов.

* <code>FORM</code> — создание формы
* <code>INPUT</code> — элемент ввода (может иметь разные функции — от ввода текста до отправки формы)
* <code>TEXTAREA</code> — текстовая область (многострочное поле для ввода текста)
* <code>SELECT</code> — список (обычно в виде выпадающего меню)
* <code>OPTION</code> — пункт списка

=== Символы ===
Чтобы создать символ, необязательно искать его на клавиатуре: можно просто набрать соответствующую [[Мнемоники в HTML|HTML-мнемонику]]; например, чтобы получить [[цент|¢]], надо набрать <code>&amp;cent;</code>, [[неразрывный пробел]] — <code>&amp;nbsp;</code>, [[Акут|ударение]] — <code>&amp;#x301;</code> и т. д.

== Названия цветов ==
{{main|Цвета HTML}}
В HTML определены следующие цвета.

{| border="0" cellspacing="3" style="font-family:monospace"
!Название
!Шестнадцатиричный цвет
|-
|black
|style="background:#000000; color:#ffffff;"|#000000
|-
|silver
|style="background:#c0c0c0; color:#000000;"|#c0c0c0
|-
|maroon
|style="background:#800000; color:#ffffff;"|#800000
|-
|red
|style="background:#ff0000; color:#ffffff;"|#ff0000
|-
|navy
|style="background:#000080; color:#ffffff;"|#000080
|-
|blue
|style="background:#0000ff; color:#ffffff;"|#0000ff
|-
|purple
|style="background:#800080; color:#ffffff;"|#800080
|-
|fuchsia
|style="background:#ff00ff; color:#000000;"|#ff00ff
|-
|green
|style="background:#008000; color:#ffffff;"|#008000
|-
|lime
|style="background:#00ff00; color:#000000;"|#00ff00
|-
|olive
|style="background:#808000; color:#ffffff;"|#808000
|-
|yellow
|style="background:#ffff00; color:#000000;"|#ffff00
|-
|teal
|style="background:#008080; color:#ffffff;"|#008080
|-
|aqua
|style="background:#00ffff; color:#000000;"|#00ffff
|-
|gray
|style="background:#808080; color:#ffffff;"|#808080
|-
|white
|style="background:#ffffff; color:#000000;"|#ffffff
|}

== Основные символы ==
{{main|Мнемоники в HTML}}
{| class="wikitable"
! Код ||Символ ||Смысл
|-
| &amp;lt; || &lt; ||меньше
|-
| &amp;gt; || &gt; ||больше
|-
| &amp;amp; || & ||[[амперсанд]]
|-
| &amp;nbsp; ||  || неразрывный пробел (предотвращает перенос строки на нём)
|-
| &amp;sect; || § ||параграф
|-
| &amp;#8470; || № ||номер
|-
| &amp;copy; || © || копирайт ({{lang-en2|copyright}})
|-
| &amp;reg; || ® || зарегистрированный товарный знак ({{lang-en2|registered trademark}})
|-
| &amp;#153; || ™ || [[товарный знак]] ({{lang-en2|trademark}})
|-
| &amp;deg; || ° || градусы
|-
| &amp;laquo; || « || открывающая кавычка—«ёлочка»
|-
| &amp;raquo; || » || закрывающая кавычка-«ёлочка»
|-
| &amp;hellip; || … || многоточие
|-
| &amp;mdash; || — || тире
|-
| &amp;#149; || • || жирная точка
|-
| &amp;plusmn; || ± || плюс-минус
|-
| &amp;minus; || − || минус
|}

Клавиатурные символы ''' ' ''' и ''' " ''' в русском языке кавычками не являются. Также неправильно на сайтах заменять №, ©, ®, ™, °C на N, (c), (R), TM, C.

Дефис, тире и минус — три разных знака.
# Клавиатурный символ '''-''' называется '''[[дефис]]''' и используется внутри слов.
# '''[[Минус]]''' шире [[дефис]]а. Он используется для записи отрицательных чисел и операции вычитания.
# '''[[Тире]]''' ещё шире, чем [[минус]]. Оно используется между словами и отбивается пробелами, причём спереди — [[неразрывный пробел|неразрывным]]. Для обозначения числовых интервалов тоже используется [[тире]], но пробелами не отбивается.
Более подробно: {{Cite web
 |url           = http://www.artlebedev.ru/kovodstvo/97/
 |title         = Тире, минус и дефис, или Черты русской типографики
 |author        = [[Артемий Лебедев]]
 |work          = Ководство
 |datepublished = 2003-01-15
 |archive-url    = https://web.archive.org/web/20071209170632/http://www.artlebedev.ru/kovodstvo/97/
 |archive-date   = 2007-12-09
 |access-date    = 2013-04-23
 |url-status      = live
}}

Символы '''&lt;''', '''&gt;''' и '''&amp;''' нельзя отобразить в HTML обычным образом, потому что они имеют специальный смысл. Для их отображения всегда используются &amp;lt;, &amp;gt; и &amp;amp; соответственно.

Большинство спецсимволов см. на webdesign.about.com/library/bl_htmlcodes.htm на сайте about.com.

== Примечания ==
{{примечания}}

== Ссылки ==
* [https://www.w3.org/TR/html401/index/elements.html Элементы] и [https://www.w3.org/TR/html401/index/attributes.html Атрибуты] для [[HTML|HTML4.01]]

{{нет источников|дата=2012-12-29}}

{{спам-ссылки|1=
* webdesign.about.com/library/bl_htmlcodes.htm
}}

[[Категория:HTML]]