Введение в HTML
HTML — основа каждой веб-страницы. До CSS и JavaScript браузеру нужна ясная структура, которая говорит, чем является каждая часть содержимого.
Что такое HTML?
HTML (HyperText Markup Language) — стандартный язык структурирования содержимого веб-страниц. Вы пишете теги вокруг текста и медиа, чтобы браузер понимал заголовки, абзацы, ссылки, изображения и другие элементы.
Почему HTML важен
Без HTML браузер плохо понимает смысл и порядок содержимого. HTML — не язык программирования, а язык разметки.
Первый взгляд на теги
HTML использует теги в угловых скобках. У большинства элементов есть открывающий и закрывающий тег.
Привет HTML
html<!DOCTYPE html>
<html>
<head>
<title>My First Page</title>
</head>
<body>
<h1>Hello HTML</h1>
<p>This is my first paragraph.</p>
</body>
</html>Что показывает этот пример
<!DOCTYPE html>указывает на современный HTML-документ<html>— корневой элемент<head>хранит сведения о странице, например title<body>содержит видимое содержимое<h1>— главный заголовок<p>— абзац
Как браузер использует HTML
Браузер читает разметку сверху вниз, строит DOM и показывает содержимое по тегам.
HyperText и ссылки
HyperText — текст, который может связываться с другими документами через ссылки. Связывание страниц превращает отдельные файлы в сайт.
Простая ссылка
html<a href="https://example.com">Visit Example</a>Элемент <a> создаёт гиперссылку. Атрибут href хранит адрес назначения.
Попробуйте сами
Создайте index.html, вставьте полный пример, сохраните и откройте в браузере. Измените заголовок и обновите страницу.
Частые ошибки
- Считать HTML языком программирования
- Забывать закрывающие теги
- Класть видимый контент в
<head>вместо<body> - Пропускать
<!DOCTYPE html>
Итоги
- HTML структурирует контент тегами
- Это разметка, не программирование
- Базовая страница: doctype, html, head, body
- Заголовки и абзацы — ранние элементы
- Ссылки соединяют страницы
- Практикуйтесь на небольшом HTML-файле
🧠 Проверьте Свои Знания
Проверьте Свои Знания
Бросьте себе вызов с помощью этой интерактивной викторины и узнайте, насколько хорошо вы понимаете тему
📝 Инструкции
- Внимательно прочитайте каждый вопрос
- Выберите лучший ответ на каждый вопрос
- Вы можете пересдавать тест столько раз, сколько захотите
- Ваш прогресс будет показан вверху