Читати книгу - "інформатика, Іванна Клиса"
Шрифт:
Інтервал:
Додати в закладку:
Елемент <hr> використовується для поділу вмісту (або визначення зміни) на HTML сторінці.
<h1>Це заголовок 1</h1>
<p>Це якийсь текст. </p>
<hr>
<h2>Це заголовок 2</h2>
<p>Це якийсь інший текст. </p>
<hr>
Наприклад:
<!DOCTYPE html>
<html>
<body>
<h1>Це заголовок 1</h1>
<p>Це якийсь текст. </p>
<hr>
<h2>Це заголовок 2</h2>
<p>Це якийсь інший текст. </p>
<hr>
<h2>Це заголовок 2</h2>
<p>Це якийсь інший текст. </p>
</body>
</html>
HTML елемент <head> (голова) – це контейнер для метаданих. Метадані HTML – це дані про документ HTML. Метадані не відображаються на сторінці, вони потрібні для службових цілей (пошукових роботів і веб-додатків).
Елемент <head> знаходиться між тегом <html> і тегом <body>:
<!DOCTYPE html>
<html>
<head>
<title>Мій перший HTML</title>
<meta charset="UTF-8">
</head>
<body>
Наприклад:
<!DOCTYPE html>
<html>
<head>
<title>Мій перший HTML</title>
<meta charset="UTF-8">
</head>
<body>
<p>HTML елемент head містить метадані. </p>
<p>Метадані – це дані про HTML сторінку. </p>
</body>
</html>
Задання кольору шрифту і фону сторінки
Background Color – Колір фону
Text Color – Колір тексту
Border Color – Колір межі
Значення кольору
RGB значення
HEX значення
HSL значення
RGBA значення
HSLA значення
В HTML колір можна вказати за допомогою назви кольору: В HTML колір можна вказати за допомогою назви кольору:
<!DOCTYPE html>
<html>
<body>
<h1 style="background-color: Tomato;">Tomato</h1>
<h1 style="background-color: Orange;">Orange</h1>
<h1 style="background-color: DodgerBlue;">DodgerBlue</h1>
<h1 style="background-color: MediumSeaGreen;">MediumSeaGreen</h1>
<h1 style="background-color: Gray;">Gray</h1>
<h1 style="background-color: SlateBlue;">SlateBlue</h1>
<h1 style="background-color: Violet;">Violet</h1>
<h1 style="background-color: LightGray;">LightGray</h1>
</body>
</html> [14].
Ви можете встановити колір фону для HTML елементів:
<!DOCTYPE html>
<html>
<body>
<h1 style="background-color: DodgerBlue;">Привіт</h1>
<p style="background-color: Tomato;">
Я дуже люблю грати баскетбол.
Навчаючись в коледжі планую стати тренером з даного виду спорту.
Я розумію, що зараз карантин, проте друзів, які бажають потренуватися зі мною чекатиму у парку на нашому місці.
</p>
</body>
</html>
Ви можете встановити колір тексту:
<!DOCTYPE html>
<html>
<body>
<h3 style="color: Tomato;">Привіт, я з коледжу фізичного виховання</h3>
<p style="color: DodgerBlue;">Я люблю займатися боксом</p>
<p style="color: MediumSeaGreen;">А ще я мені подобається відвідувати уроки інформатики</p>
</body>
</html>
Зображення можуть поліпшити дизайн і зовнішній вигляд веб-сторінки.
<!DOCTYPE html>
<html>
<body>
<h2>HTML Зображення</h2>
<img src=".. /images/pic_trulli. jpg" alt="Trulli" width="500" height="333">
</body>
</html>
Атрибути тегів. Коментар. Задання заголовків. Задання кольору шрифту і фону сторінки
6.5. Форматування тексту
В попередньому розділі ви дізнались про HTML атрибут style.
HTML також визначає спеціальні елементи для визначення тексту з особливою важливістю.
HTML використовує такі елементи, як <b> та <i> для форматування виведення, наприклад жирний або курсивний текст [14].
HTML елементи <b> та <strong>
HTML елемент <b> визначає жирний текст без додаткового значення.
<b>Цей текст є жирним</b>
<!DOCTYPE html>
<html>
<body>
<p>Цей текст звичайний. </p>
<p><b>Цей текст жирний. </b></p>
</body>
</html>
Увага!
Сайт зберігає кукі вашого браузера. Ви зможете в будь-який момент зробити закладку та продовжити читання книги «інформатика, Іванна Клиса», після закриття браузера.