网络零售商的终极网站
 HTML5。 入门的教训。  W3Schools 乌克兰语

西斯

HTML Форматування тексту


HTML містить кілька елементів для визначення тексту зі спеціальним значенням.



Форматування тексту

Цей текст жирний

Цей текст курсивом

Це нижній індекс і верхній індекс

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

HTML елементи форматування

В попередньому розділі ви дізнались про HTML атрибут style.

HTML також визначає спеціальні елементи для визначення тексту з особливою важливістю.

HTML використовує такі елементи, як <b> та <i> для форматування виведення, наприклад жирний або курсивний текст.

Елементи форматування були розроблені для відображення спеціальних типів тексту:

  • <b> - Жирний текст
  • <strong> - Важливий текст (виділяється жирним)
  • <i> - Курсивний текст
  • <em> - Важливий текст (виділяється курсивом)
  • <mark> - Помічений (маркований) текст
  • <small> - Маленький текст
  • <del> - Видалений текст
  • <ins> - Вставлений текст
  • <sub> - Підрядковий текст (нижній індекс)
  • <sup> - Надрядковий текст (верхній індекс)

HTML елементи <b> та <strong>

HTML елемент <b> визначає жирний текст без додаткового значення.

Приклад

<b>Цей текст є жирним</b>
Спробуйте самі »

HTML елемент <strong> визначає важливий текст з додатковим семантично "важливим" значенням.

Приклад

<strong>Цей текст є виділеним</strong>
Спробуйте самі »

HTML елементи <i> та <em>

HTML елемент <i> визначає курсивний текст без якого-небудь додаткового значення.

Приклад

<i>Цей текст є курсивним</i>
Спробуйте самі »

HTML елемент <em> визначає виділений текст з додатковим семантичним значенням.

Приклад

<em>Цей текст є виділеним</em>
Спробуйте самі »

Примітка: Браузери відображають <strong> як <b>, та <em> як <i>. Однак, є різниця в значенні цих тегів: <b> та <i> визначають жирний та курсивний текст, але <strong> та <em> означають, що текст "важливий" за смисловим значенням.


HTML елемент <small>

HTML елемент <small> визначає зменшений текст (відносно розміру основного тексту за умовчанням):

Приклад

<h2>HTML <small>Зменшене</small> форматування</h2>
Спробуйте самі »

HTML елемент <mark>

HTML елемент <mark> визначає маркований/виділений текст:

Приклад

<h2>HTML <mark>Марковане</mark> форматування</h2>
Спробуйте самі »

За умовчанням маркований текст виділяється жовтим кольором.


HTML елемент <del>

HTML елемент <del> визначає видалений/вилучений текст.

Приклад

<p>Мій улюблений колір <del>синій</del> червоний.</p>
Спробуйте самі »

Текст відображається закресленим.


HTML елемент <ins>

HTML елемент <ins> визначає вставлений/доданий текст.

Приклад

<p>Мій улюблений <ins>колір</ins> червоний.</p>
Спробуйте самі »

Текст відображається підкресленим.


HTML елемент <sub>

HTML елемент <sub> визначає підрядковий текст (нижній індекс).

Приклад

<p>Це є <sub>підрядковий</sub> текст.</p>
Спробуйте самі »

Текст відображається як нижній індекс.


HTML елемент <sup>

HTML елемент <sup> визначає надрядковий текст (верхній індекс).

Приклад

<p>Це є <sup>надрядковий</sup> текст.</p>
Спробуйте самі »

Текст відображається як верхній індекс.


HTML 右

Перевірте себе за допомогою вправ

Вправа:

Додайте додаткове значення до слова 'деградацію' в параграфі нижче.

<p>
Місія цього сайту - це зупинити масову деградацію молодого покоління нашої країни.
</p>


HTML елементи форматування тексту

Тег Опис
<b> Визначає жирний текст
<em> Визначає семантично важливий текст
<i> Визначає курсивний текст
<small> Визначає маленький текст
<strong> Визначає семантично важливий текст
<sub> Визначає підрядковий текст (нижній індекс)
<sup> Визначає надрядковий текст (верхній індекс)
<ins> Визначає вставлений текст
<del> Визначає видалений текст
<mark> Визначає маркований/помічений текст

Для отримання повного списку всіх доступних HTML тегів, відвідайте HTML 标签浏览器 на нашому сайті W3Schools 乌克兰.


Запитання для самоконтролю

  • Що таке форматування тексту HTML-сторінки?
  • Які бувають HTML-елементи форматування?
  • Для чого потрібні елементи форматування?
  • Який HTML-елемент визначає жирний текст без додаткового значення?
  • Який HTML-елемент визначає жирний текст з додатковим семантично важливим значенням?
  • Який HTML-елемент визначає курсивний текст без якого-небудь додаткового значення?
  • Який HTML-елемент визначає курсивний текст з додатковим семантично важливим значенням?
  • Який HTML-елемент визначає зменшений текст відносно розміру основного тексту?
  • Який HTML-елемент визначає маркований/виділений текст?
  • Який HTML-елемент визначає видалений/вилучений текст?
  • Який HTML-елемент визначає вставлений/доданий текст?
  • Який HTML-елемент визначає підрядковий текст (нижній індекс)?
  • Який HTML-елемент визначає надрядковий текст (верхній індекс)?


Коментарі