HTML. Форматирование текста

Форматирование текста в HTML. Теги, задающие формат шрифта: полужирный, курсив, подчеркнутый, зачеркнутый, подстрочный, надстрочный, выделенный и другие.

Полужирный текст

Полужирный шрифт задается парным тегом <b>:

Пример Результат
<b>Полужирный текст</b> Полужирный текст

Тег <b> используется только для оформления внешнего вида текста.

Важный полужирный текст

Важный полужирный текст задается парным тегом <strong>:

Пример Результат
<strong>Важный полужирный текст</strong> Важный полужирный текст

Браузеры воспринимают текст, выделенный тегом <strong>, как важный. На html-странице он отображается полужирным шрифтом. Тег <strong>, в отличие от тега <b>, несет дополнительный смысл, придающий тексту важность.

Курсивный текст

Курсивный шрифт задается парным тегом <i>:

Пример Результат
<i>Курсивный текст</i> Курсивный текст

Тег <i> используется только для оформления внешнего вида текста.

Важный курсивный текст

Важный курсивный текст задается парным тегом <em>:

Пример Результат
<em>Важный курсивный текст</em> Важный курсивный текст

Тег <em> задает шрифту курсивное начертание, но в отличие от тега <i>, несет дополнительный смысл, придающий тексту важность.

Выделенный текст

Выделенный текст задается парным тегом <mark>:

Пример Результат
<mark>Выделенный текст</mark> Выделенный текст

Тег <mark> помечает текст как выделенный, который обычно отличается от остального текста цветом фона. В моей теме, как видно из примера, текст выделяется исключительно черным шрифтом. Вид выделенного текста можно настроить с помощью стилей.

Удаленный текст

Удаленный текст задается парным тегом <del>:

Пример Результат
<del>Удаленный текст</del> Удаленный текст

Тег <del> обычно помечает текст зачеркиванием и используется для выделения ошибочного текста или текста, считающегося удаленным в новой версии документа.

Вставленный текст

Вставленный текст задается парным тегом <ins>:

Пример Результат
<ins>Вставленный текст</ins> Вставленный текст

Тег <ins> обычно помечает текст подчеркиванием и используется для выделения текста, который был добавлен в новую версию документа. Это позволяет отследить изменения, внесенные в документ. В моей теме, как видно из примера, вставленный текст никак не выделяется.

Подстрочный текст

Подстрочный текст задается парным тегом <sub>:

Пример Результат
<sub>Подстрочный текст</sub> Подстрочный текст Обычный текст

Тег <sub> отображает текст в виде нижнего индекса. Его можно использовать при написании химических формул и уравнений, например, формулы бензола: C6H6.

Надстрочный текст

Надстрочный текст задается парным тегом <sup>:

Пример Результат
<sup>Надстрочный текст</sup> Надстрочный текст Обычный текст

Тег <sup> отображает текст в виде верхнего индекса. Его можно использовать при указании сносок или написании математических формул и уравнений, например: y = x2.

Подчеркнутый текст

Подчеркнутый текст может быть задан парным тегом <u>:

Пример Результат
<u>Подчеркнутый текст</u> Подчеркнутый текст

Обычно, тег <u> отображает текст с нижнем подчеркиванием.

Атрибут text-decoration

С помощью стилей, а конкретнее — атрибута text-decoration, можно добавить линию, которая будет подчеркивать, зачеркивать или располагаться над текстом:

Пример Результат
<span style="text-decoration: underline;">Подчеркнутый текст</span> Подчеркнутый текст
<span style="text-decoration: line-through;">Зачеркнутый текст</span> Зачеркнутый текст
<span style="text-decoration: overline;">Линия над текстом</span> Линия над текстом

Добавить комментарий

Ваш комментарий будет опубликован после прохождения обязательной модерации. Исходящие ссылки не допускаются. Время модерации составит от нескольких минут до нескольких часов в зависимости от времени суток и занятости модератора.