Учебник по HTML

Введение в HTML

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

Что такое HTML?

Вот ключевые моменты об HTML:

HTML означает HyperText Markup Language.
Это стандартный язык разметки для создания веб-страниц.
Он описывает структуру веб-страницы.
Он состоит из ряда элементов.
Элементы HTML сообщают браузеру, как отображать содержимое.
Элементы обозначают части содержимого, например «это заголовок», «это абзац» или «это ссылка».

Простой документ HTML

Вот как выглядит базовая HTML-страница, с объяснением каждой части:

<!DOCTYPE html> сообщает, что это документ HTML5.
<html> — корневой элемент, охватывающий всю страницу.
<head> содержит мета-информацию о странице.
<title> задаёт заголовок, отображаемый во вкладке браузера.
<body> содержит всё, что видно на странице, например заголовки, абзацы, изображения и ссылки.
<h1> определяет крупный заголовок.
<p> определяет абзац.

Пример

Полная базовая HTML-страница.

Минимальный, но полный HTML5-документ: doctype, html, head с заголовком «Заголовок Страницы», и body, содержащий h1 «Мой Первый Заголовок» и абзац «Мой первый абзац.»

> Вывод: полная HTML-страница

Prompt

Минимальный, но полный HTML5-документ: doctype, html, head с заголовком «Заголовок Страницы», и body, содержащий h1 «Мой Первый Заголовок» и абзац «Мой первый абзац.»

Вывод: полная HTML-страница

<!DOCTYPE html>
<html lang="ru">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Заголовок страницы</title>
</head>
<body>

<h1>Мой первый заголовок</h1>
<p>Мой первый абзац.</p>

</body>
</html>

Что такое элемент HTML?

Элемент HTML состоит из открывающего тега, некоторого содержимого и закрывающего тега. Элемент — это всё, что находится от открывающего тега до закрывающего. Например, в <h1>Мой первый заголовок</h1> открывающий тег — <h1>, содержимое — «Мой первый заголовок», а закрывающий тег — </h1>.

Примечание: У некоторых элементов нет содержимого, например у <br>. Они называются пустыми элементами, и у них нет закрывающего тега.

Синтаксис элемента

Общая форма элемента: открывающий тег, содержимое и закрывающий тег.

<tagname> Content goes here... </tagname>

Веб-браузеры

Веб-браузер, например Chrome, Edge, Firefox или Safari, читает HTML-документы и правильно их отображает. Браузер не показывает сами HTML-теги; он использует их, чтобы решить, как отобразить страницу.

Структура HTML-страницы

HTML-страница строится из вложенных элементов: <html> охватывает страницу, <head> содержит заголовок и мета-информацию, а <body> содержит видимое содержимое.

Примечание: Содержимое внутри <body> отображается в браузере. Текст внутри <title> отображается в заголовке или вкладке браузера.