HTML (от англ. HyperText Markup Language — язык гипертекстовой разметки) использует систему разметки, позволяющую вставлять элементы описывающие содержимое и его и тип. Разметка означает, что HTML объявляет, что представлено, но не как представлено. Визуальное представление определяются каскадными таблицами стилей (CSS) и реализуются браузерами.
Все еще существующие элементы, которые позволяют описать вид, например, font, полностью устарели и не должны использоваться.
HTML иногда называют языком программирования, но он не имеет логики, поэтому это язык разметки. HTML-теги предоставляют семантическое значение и удобочитаемость для содержимого на странице.
Версия | Спецификация | Дата |
---|---|---|
1.0 | нет | 01.01.1994 |
2.0 | RFC 1866 | 24.11.1995 |
3.2 | W3C: HTML 3.2 Спецификация | 14.01.1997 |
4.0 | W3C: HTML 4.0 Спецификация | 24.04.1998 |
4.01 | W3C: HTML 4.01Спецификация | 24.12.1999 |
5 | W3C: HTML 5.0 Спецификация | 28.10.2014 |
5.1 | W3C: HTML 5.1 Спецификация | 01.11.2016 |
5.1-1 | W3C: HTML 5.1 2nd Edition | 03.11.2017 |
Весь текст, заключённый между начальным и конечным тегом, включая и сами эти теги, называется элементом. Сам же текст между тегами — содержанием элемента. Содержание элемента может включать в себя любой текст, в том числе и другие элементы.
Таким образом, элемент обычно элемент имеет вид:
<tag> ... содержание ... </tag>
Нужно различать элементы и теги.
Элементы: video, audio, table, footer.
Теги: <video>
, <audio>
, <table>
, <footer>
, </html>
, </body>
.
Тег (от англ. tag — именованная метка). В HTML — это специальное зарезервированное слово, заключённое в угловые скобки (например, <div>
). Внутри тегов заключается отображаемая на веб-странице информация. Записывать их рекомендуется в нижнем регистре, то есть обычными маленькими буквами: не <BODY>
, а <body>
.Текст, содержащийся между начальным и конечным тегом, отображается и размещается в соответствии со свойствами, указанными в начальном теге.
Обычно используются парные теги — открывающий, или начальный, и закрывающий, или конечный. Возможно также применение одиночного тега. Например, тег отступа абзаца может оформлять абзац между тегами <p>
и </p>
, а может в одиночной форме до следующего первого попавшегося тега <p>
.
Бывают и непарные (одиночные) теги. Их, в отличие от парных тегов, не нужно закрывать, потому что они не работают с содержимым, а выполняют какую-то предопределенную функцию. Например, тег <br>
устанавливает перенос текста на следующую строку.
Порядок следования закрывающих тегов должен быть обратным тому, в котором следуют теги открывающие. Говоря иначе, теги со всем их содержимым должны полностью вкладываться в другие теги, не оставляя "хвостов" снаружи. Элементы должны быть строго вложенными друг в друга, «перехлёст» элементов недопустим:
<i><b>Text</i></b>
<b><i>Text</i></b>
Распространённое заблуждение, что HTML разрешают «перехлёст» элементов, основано на нарушающем стандарты поведении браузеров, пытавшихся «исправлять» ошибки разметки по собственным алгоритмам.
Однако HTML допускают применение ряда сокращенных синтаксических конструкций, в том числе необязательные закрывающие и даже открывающие теги (автоматически достраиваемые при разборе документа на основе указанной схемы документа и текущего контекста). В XML, напротив, все теги должны быть открыты и закрыты явным образом, что значительно упрощает алгоритм его разбора и снижает требования к аппаратному обеспечению для него.
У тега могут быть свойства, называемые атрибутами, дающие дополнительные возможности и позволяющие более гибко управлять содержимым. Они записываются в виде сочетания: имя атрибута-значения, причём текстовые значения заключаются в кавычки.
Так тег <img>
добавляет на веб-страницу рисунок, а его атрибут src
указывает адрес изображения, а атрибут width
задает ширину изображения в пикселах:
<img src="../img/pic.png" width="100px">
Допустимо использовать некоторые атрибуты у тегов, не присваивая им никакого значения, например атрибут disabled
.
Для создания простой HTML-страницы подойдет любой текстовый редактор. Важно сохранить страницу с расширением .html или .htm. Например:
<!DOCTYPE html>
<html lang="ru">
<head>
<meta charset="UTF-8">
<title>Привет!</title>
</head>
<body>
<h1>Hello World!</h1>
<p>Это простой абзац.</p>
</body>
</html>
В этом примере используются теги:
Тег | Описание |
---|---|
<!DOCTYPE> |
Определяет версию HTML, используемую в документе. В данном случае это HTML5. Дополнительную информацию см. В разделе «Doctypes». |
<html> |
Разметка страницы начинается с этого тега. После тега закрытия (</html> ) не должно быть ничего. Атрибут lang объявляет основной язык страницы с использованием кодов языка ISO (ru для русского). Дополнительную информацию см. В разделе «Язык контента». |
<head> |
Открывает раздел заголовка, который не отображается в главном окне браузера, но содержит информация о документе HTML, называемую метаданными. Этот раздел также может содержать импорт из внешних стилей и скриптов. Закрывающий тег </head> . |
<meta> |
Предоставляет браузеру некоторые метаданные о документе. Атрибут charset объявляет кодировку символов. Современные HTML-документы всегда должны использовать UTF-8, хотя это не является обязательным требованием. В HTML тег <meta> не требует закрывающего тега. |
<title> |
Название страницы. Текст, заключенный между начальным и конечным тегом <title> , будет отображаться на вкладке страницы или в строке заголовка браузера |
<body> |
Открывает часть документа, отображаемую для пользователей, т.е. весь видимый или слышимый контент страницы. После закрытия тега </body> содержимое не должно добавляться. |
<h1> |
Заголовок 1 уровня . Дополнительную информацию см. В разделе «Заголовки». |
<p> |
Описывает обычный абзац |