Урок 9 із 239
4%
← Назад

Теги для заголовків сторінки

Вивчіть HTML-теги заголовків h1-h6 та їх правильне використання.

Теги для заголовків сторінки

Окрім абзаців, важливу роль на сторінці відіграють заголовки. Їх можна порівняти із заголовками у книзі: кожна глава має свою назву, а всередині можуть бути підрозділи з власними заголовками.

Основний текст сторінки зазвичай розміщується всередині абзаців, а заголовки допомагають створити правильну структуру документа.

Теги h1-h6

Для створення заголовків у HTML використовуються теги від h1 до h6. Вони мають різний рівень важливості: h1 — найголовніший заголовок сторінки, а h6 — найменш важливий.

ТегПризначення
<h1>Головний заголовок сторінки
<h2>Заголовок розділу
<h3>Заголовок підрозділу
<h4>-<h6>Менш важливі заголовки
<h1>Heading h1</h1>

<h2>Heading h2</h2>

<h3>Heading h3</h3>

<h4>Heading h4</h4>

<h5>Heading h5</h5>

<h6>Heading h6</h6>

За замовчуванням браузер показує заголовки жирним шрифтом і робить їх різного розміру. Ці параметри можна змінити за допомогою CSS.

<h1>Мій перший сайт</h1>

<h2>Про мене</h2>

<p>
  Тут знаходиться текст про автора сайту.
</p>

<h2>Мої роботи</h2>

<p>
  Опис першої роботи.
</p>

<p>
  Опис другої роботи.
</p>
❗ Важливо:

На сторінці зазвичай використовується один головний заголовок h1. Інші заголовки h2-h6 створюють структуру розділів та підрозділів.

📌 Завдання:
  1. Створіть заголовок h1 із назвою вашої сторінки.
  2. Додайте заголовок h2 та абзац під ним.
  3. Створіть ще один заголовок h2.
  4. Додайте під ним два абзаци тексту.
  5. Перевірте результат у браузері.
💡 Показати підказку

Пам'ятайте: h1 — це головний заголовок, h2 — розділи сторінки, а абзаци створюються тегом p.

✅ Показати відповідь
Приклад:

<h1>Мій сайт</h1>

<h2>Про мене</h2>

<p>
  Перший текстовий блок.
</p>

<h2>Мої навички</h2>

<p>
  HTML та CSS.
</p>

<p>
  JavaScript та React.
</p>