Поняття про мову HTML
Звичайний текст можна пристосувати для відображення браузером за допомогою спеціальних позначок — тегів, сукупність яких разом із правилами їх використання називають мовою розмітки гіпертексту.
Отже, вебсторінка — це текстовий документ, розмічений тегами HTML, відображений у вікні браузера. HTML не є мовою програмування.
HTML (англ. HyperText Markup Language — мова розмітки гіпертексту) — це набір тегів та правила їх застосування для створення гіпертекстових документів.
HTML-документ
Існують спеціалізовані HTML-редактори: Microsoft SharePoint Designer, Notepad++, Phoenix Code Editor, Sublime Text, та онлайнредактори: Online HTML Editor, HTML Instant, Real-Time HTML Editor та інші. HTML-документ (HTML-файл) є текстовим документом, тому створити його можна в будь-якому текстовому редакторі.
Тег — це записана в кутових дужках < > позначка мови HTML, яку опрацьовує браузер.
Рис.1. Приклад HTML-коду та його відображення у вікні браузера
Структуру HTML-документа визначають такі теги:
| <html> | Початок документа |
| <head> | Початок заголовка — службової частини коду |
| <title> | Назва, що виводитиметься на вкладці браузера |
| </title> | Кінець назви |
| </head> | Кінець заголовка |
| <body> | Початок «тіла» документа, яке виводить браузер |
| </body> | Кінець «тіла» документа |
| </html> | Кінець документа |
Форматування тексту
У HTML-документі розмір і регістр символів, якими записано теги, не мають значення. Розмір і накреслення символів, що відображаються у вікні браузера, визначаються розміткою документа.Зверни увагу!
Теги мови HTML визначають вигляд і функціонування об’єктів на вебсторінці сайту.
Теги бувають парними і непарними. Парний тег складається з відкривального і закривального тегів. Закривальний тег починається символом «/».
| <b>…</b> | Парний | тег жирного накреслення |
| <br> або <br/> | Непарний | тег розриву рядка |
| <p>...</p> |
Парний | Новий абзац із відступом |
| <h1> | Парний | Заголовок: <h1> — найвищий рівень, <h6> — найнижчий |
| <i>…</i> | Парний | Курсив |
Приклад:
Застосування парного тегу жирного накреслення (рис.2)
Рис.2
Теги з помилками або такі, що не підтримуються браузером, ігноруються.
Тег може містити атрибути, значення яких впливають на його дію. Атрибути записуються у відкривальному тегу, після назви, відокремлюючи один від одного пропусками.
Значення атрибутів, що містять пропуски, беруть в одинарні або подвійні лапки. Для решти значень це не обов’язково.
Значення атрибутів, що містять пропуски, беруть в одинарні або подвійні лапки. Для решти значень це не обов’язково.
Рис.2
Значення атрибутів, що містять пропуски, беруть у лапки. Для решти значень це не обов’язково.
Значення атрибутів, що містять пропуски, беруть у лапки. Для решти значень це не обов’язково.
Приклад:
Застосування атрибутів text і bgсolor (колір тексту і тла) (рис. 3).
Рис.3
Марковані та нумеровані списки
Для створення маркованого списку використовують тег <ul>…</ul> з атрибутом type, який задає вигляд маркера:
"disk" —
; "circle" — 
; "square" — 
.
"disk" —
; "circle" — ; "square" — .Для створення нумерованих списків використовують тег <ol>…</ol> з атрибутами type (тип нумерації: "1" — арабські цифри, "А" — латинські літери, "І" — римська нумерація тощо) і start (задання початкового номера арабськими цифрами).
Приклад:
Елементи списку розмічають тегами <li>…</li> (рис. 4).
Рис.4
Ідею гіпертексту вперше описав 1941 року аргентинський письменник Хорхе Луїс Борхес, а термін «гіпертекст» увів 1965 року американський учений Тед Нельсон.
Джерела:
Інформатика : підруч. для 8 кл. закл. загал. серед. освіти / [О. О. Бондаренко, В. В. Ластовецький, О. П. Пилипчук, Є. А. Шестопалов]. — Харків : Вид-во «Ранок», 2025