Зміст курсу
Основи HTML
Основи HTML
Спеціальна Розмітка Тексту
Теги форматування тексту
HTML надає кілька тегів форматування тексту, які дозволяють додавати акценти, підкреслювати або закреслювати текст за потреби.
Теги <strong>
та <em>
використовуються для акцентування тексту. Тег <strong>
відображає текст жирним шрифтом, вказуючи на сильну важливість, тоді як тег <em>
відображає текст курсивом, вказуючи на акцент.
Тег <u>
підкреслює текст, щоб забезпечити візуальну ясність та виділити важливу інформацію. Однак використовуйте підкреслення помірно, щоб уникнути захаращення тексту.
Тег <s>
закреслює текст, вказуючи на видалення або неактуальність. Він зазвичай використовується, щоб показати, що певний текст був видалений або більше не є дійсним.
Приклад:
index
index
index
У наведеному вище прикладі:
- Теги
<strong>
та<em>
надають акцент тексту, де<strong>
відображає текст жирним шрифтом, а<em>
курсивом; - Тег
<u>
підкреслює текст, виділяючи його візуально; - Тег
<s>
закреслює текст, вказуючи на видалення або неактуальність.
Посилання
Посилання, також відомі як гіперпосилання, дозволяють користувачам переходити між веб-сторінками, ресурсами та різними формами комунікації. У HTML посилання створюються за допомогою тега <a>
(якір).
Атрибут href
у тегу <a>
вказує на місце призначення посилання. Він може приймати різні типи URL, включаючи:
- Абсолютні URL: Вказують повну адресу пов'язаного ресурсу, включаючи протокол (наприклад,
"https://www.example.com"
); - Телефонні URL: Дозволяють користувачам ініціювати телефонні дзвінки безпосередньо з браузера при натисканні. Форматуються як
"tel:phone-number"
. Важливо включити код країни та видалити будь-які спеціальні символи або пробіли з номера телефону (наприклад,"tel:+123456789"
); - Email URL: Дозволяють користувачам складати електронні листи при натисканні. Форматуються як
"mailto:email-address"
. Важливо включити повну електронну адресу післяmailto:
(наприклад,"mailto:example@example.com"
).
Приклад:
index
index
index
У наведеному вище прикладі:
- Тег
<a>
створює гіперпосилання з різними місцями призначення; - Атрибут
href
вказує на різні URL, включаючи абсолютні URL, телефонні номери та електронні адреси.
Інші корисні атрибути
Тег <a>
має кілька атрибутів, які можна використовувати для вказівки властивостей гіперпосилання. Деякі загальні атрибути включають:
target="_blank"
: Вказує, де відкрити пов'язаний документ."_blank"
відкриває посилання у новому вікні або вкладці;download
: Вказує, що ціль буде завантажено, коли користувач натисне на гіперпосилання. Цей атрибут може мати значення для вказівки імені файлу для збереження ресурсу.
Приклад:
index
index
index
У цьому прикладі:
- Атрибут
href
вказує URL пов'язаного ресурсу; - Атрибут
target
відкриває посилання у новому вікні або вкладці.
Кнопки
Тег <button>
створює клікабельні кнопки на веб-сторінках. Він дозволяє користувачам взаємодіяти з веб-сторінкою, виконуючи дії, такі як відправка форми або виконання JavaScript коду. Хоча ми не будемо зосереджуватися на JavaScript у цьому курсі, важливо знати, що така можливість існує.
Типи кнопок
- Стандартна кнопка (
<button type="button">
): Загального призначення кнопка, яка використовується для різних дій на веб-сторінці, таких як виклик JavaScript функцій або навігація на іншу сторінку; - Кнопка відправки (
<button type="submit">
): Використовується всередині форми для відправки даних форми на сервер; - Кнопка скидання (
<button type="reset">
): Використовується всередині форми для скидання полів форми до їхніх значень за замовчуванням.
Приклад:
index
index
index
У наведеному вище прикладі:
- Перша кнопка є стандартною кнопкою з атрибутом
onclick
, який викликає сповіщення при натисканні; - Друга кнопка є кнопкою відправки, яка відправляє дані форми на сервер;
- Третя кнопка є кнопкою скидання, яка скидає поля форми до їхніх значень за замовчуванням.
Відео-урок
Дякуємо за ваш відгук!