Вивчайте Завдання: Правильно структурувати HTML-документ

Свайпніть щоб показати меню

Мета

Створення правильної веб-сторінки шляхом побудови базової структури HTML-документа. Ця структура є основою кожної HTML-сторінки та складається з необхідних елементів, які потрібні браузерам для коректного відображення вашого контенту.

Примітка

Не дозволяйте уявній простоті дизайну веб-сторінки ввести вас в оману. Хоча вона може здаватися простою, надзвичайно важливо дотримуватися правильної структури документа. Це гарантує збереження читабельності та функціональності сайту у всіх браузерах.

Завдання

Створення базової структури HTML-документа. Якщо вже впевнені у своїх навичках, можете виконати завдання без покрокової інструкції. Однак, якщо потрібна додаткова допомога, доступна покрокова інструкція для підтримки під час виконання.

Покрокова інструкція

Крок 1: Початок HTML-документа

Почніть з написання декларації doctype HTML, яка повідомляє браузеру, що документ написаний мовою HTML. Декларація повинна бути першим рядком у вашому HTML-документі:

index.html

Крок 2: Додавання відкриваючих і закриваючих тегів html

Після декларації doctype додайте відкриваючий і закриваючий теги HTML. Вся структура HTML-документа буде міститися всередині цих тегів. Додатково вкажіть атрибут lang, щоб визначити мову документа:

index.html

Крок 3: Створення секції head

Додайте відкриваючий та закриваючий теги <head> всередині тегів HTML. Секція head містить метаінформацію про HTML-документ, таку як заголовок і посилання на зовнішні таблиці стилів:

index.html

Крок 4: Додавання заголовка

Всередині тегів <head> додайте відкриваючий та закриваючий теги <title>. Текст, який ви введете між цими тегами, буде відображатися як заголовок вебсторінки у заголовку вікна браузера або на вкладці:

index.html

Крок 5: Створення секції body

Після секції <head> додайте відкриваючий і закриваючий теги <body>. Секція body містить видимий вміст вебсторінки:

index.html

Крок 6: Додавання вмісту до body

Усередині тегів <body> можна додавати елементи, такі як заголовки, абзаци, зображення, посилання тощо. Ось приклад додавання заголовка та абзацу:

index.html

Спробуйте самостійно

index.html

Все було зрозуміло?

Дякуємо за ваш відгук!

Секція 1. Розділ 16

Запитати АІ

Запитайте про що завгодно або спробуйте одне із запропонованих запитань, щоб почати наш чат

Секція 1. Розділ 16