Теги – службові символи (команди HTML), що вказують браузеру, як слід відображати Web-сторінку. Теги починаються і закінчуються кутовими дужками.
Теги мають таку структуру:
Атрибути - додаткові елементи тегів, які змінюють вигляд об'єктів, до яких застосовуються. Атрибут записується після імені тега перед закриваючою дужкою і складається із пари: ім'я атрибуту = „значення”.
Основні теги для форматування тексту:
<p> текст </p> Початок нового абзацу. Абзаци відокремлюються порожніми рядками. Якщо закриваючого тега немає, вважається, що кінець абзацу збігається з початком наступного абзацу або іншого блочного елемента.
<br> Непарний тег. Перехід у новий рядок. Текст буде наведено у новому рядку без пропуску рядка, як у випадку використання <p>
<hr> Непарний тег. У рядку буде проведена горизонтальна лінія/
Приклад 1. Створимо веб-сторінку, оформивши текст згідно зразка.
Хід роботи.
У своїй папці WebDesign створіть папку Урок_2
Запустіть VScode.
У папці Урок_2 створіть файл Sample1.html, ввівши в нього розмітку. Для цього натисніть ! і клавішу Enter.
В тіло html-документа вставте текст з файлу Тема2-2-1.txt. Пам'ятайте, що в тексті автоматично "проковтуються" зайві пробіли та переноси.
Задайте Львів як заголовок <h1>, а Географічне положення та Музеї Львова як заголовок <h2>.
Географічний опис розпочніть з абзацу.
Слово Львів на початку опису зробіть збільшеним жирним шрифтом, а фразу Львівської області - жирним шрифтом.
Яворівським, Жовківським та Пустомитівським районами задайте курсивним шрифтом, а східноєвропейському - підкресліть.
Цифру 2 біля 182 км зробіть верхнім індексом (sup).
Проведіть горизонтальну лінію (hr).
Кінцевий вигляд сторінки
Італійський дворик та Музей скла розпочніть з абзацу, задайте жирним шрифтом з логічним наповненням (strong), виділіть маркером (mark )та оформіть як визначення (dl, dt, dd).
Самостійна робота. Забезпечте відображення тексту, заданого в файлі С_2.2_1.txt на веб-сторінці згідно зразка. Задайте назву "Львівська область". Перший рядок зробіть рухомим. Для форматування скористайтеся вивченими тегами.