Какие различные теги форматирования доступны в HTML?

Создание HTML Изучение

Как мы знаем, HTML предоставляет множество предопределенных элементов, которые используются для изменения форматирования текста. Форматирование можно использовать для установки стилей текста (например, полужирный, курсив, выделение и т. д.), выделения текста, создания надстрочного и подстрочного индекса и т. д.

В этой статье мы обсудим различные теги форматирования в HTML.

  1. Теги <b>и <strong>. Оба тега используются для выделения текста жирным шрифтом. Текстовое содержимое тега отображается как важная информация на веб-странице.

Синтаксис:

<b> ... </b>
<strong> ... </strong>

Пример:

HTML

<!DOCTYPE html>
<html>
 
<head>
    <title>Bold and strong</title>
</head>
 
<body>
    <!--Normal text-->
    <p>Normal Text</p>
 
    <!--Text in Bold-->
    <p><b>Bold Text</b></p>
 
    <!--Text in Strong-->
    <p><strong> Strong Text</strong></p>
</body>
 
</html>

Вывод:

Оба тега используются для выделения текста жирным шрифтом

  1. Теги <i>и <em>. Оба тега используются для выделения текста курсивом и акцентом. Оба элемента имеют открывающий и закрывающий теги.

Синтаксис:

<i> ... </i>
<em> ... </em>

Пример:

HTML

<!DOCTYPE html>
<html>
 
<head>
    <title>Italic and emphasized</title>
</head>
 
<body>
    <!--Normal text-->
    <p>Normal Text</p>
 
    <!--Text in Italics-->
    <p><i>The Text inside italic Tag</i></p>
 
    <!--Text in Emphasize-->
    <p><em>Emphasized Text</em></p>
</body>
 
</html>

Вывод:

Читайте также:  Cравнение облачных сервисов AWS, Google Cloud и Azure

Оба тега используются для выделения текста курсивом и акцентом

  1. Теги <small>и <big> : Тег <small> используется для установки маленького размера шрифта, тогда как тег <big> используется для установки большого размера шрифта.

Синтаксис:

<small> ... </small>
<big> ... </big>

Пример:

HTML

<!DOCTYPE html>
<html>
 
<head>
    <title>Small and Big</title>
</head>
 
<body>
    <!--Text in Normal-->
    <p>Normal text</p>
 
    <small>The text inside small Tag</small>
    <p>
        <big>The text inside big Tag</big>
    </p>
</body>
 
</html>

Вывод:

используется для установки маленького размера шрифта, тогда как тег

  1. Теги <sup>и <sub>: тег <sup> используется для надстрочного индекса текста, тогда как тег <sub> используется для нижнего индекса текста.

Синтаксис:

<sup> ... </sup>
<sub> ... </sub>

Пример:

HTML

<!DOCTYPE html>
<html>
 
<head>
    <title>Superscript and Subscript</title>
</head>
 
<body>
 
    <!--Text in Normal-->
    <p>Normal Text
     
    <!--Text in Superscript-->
    <p>
        <sup>superscript </sup> Text
    </p>
 
    <!--Text in Subscript-->
    <p>
        <sub>subscript</sub>Text
    </p>
</body>
 
</html>

Вывод:

используется для надстрочного индекса текста, тогда как тег

  1. Тег <ins>и <del>: Тег <ins> используется для подчеркивания текста, помечающего часть как вставленную или добавленную. Он также имеет открывающий и закрывающий теги. Этот тег в основном используется в тексте вместо удаленного текста, тогда как тег <del> используется для удаления текста, он добавляет зачеркивание к тексту.
Читайте также:  Функциональные и нефункциональные требования: полное руководство

Синтаксис:

<ins> ... </ins>
<del> ... </del>

Пример:

HTML

<!DOCTYPE html>
<html>
 
<head>
    <title>Inserting and deleting</title>
</head>
 
<body>
    <!--Deleting andText in Insert-->
    <b>
        <p>The TajMahal is located in
            <del>Bombay</del>
            <ins>Agra</ins>
        </p>
    </b>
</body>
 
</html>

Вывод:

используется для подчеркивания текста, помечающего часть как вставленную или добавленную

  1. Тег HTML <mark>: Тег <mark> используется для выделения текста. Он имеет открывающий и закрывающий тег.

Синтаксис:

<mark> ... </mark>

Пример:

HTML

<!DOCTYPE html>
<html>
 
<head>
    <title>Highlight</title>
</head>
 
<body>
 
    <!--Text in Normal-->
    <p>Normal Text</p>
 
    <!--Text in Highlight-->
    <p>
        <mark>Highlighted Text</mark>
    </p>
</body>
 
</html>

Вывод:

Он имеет открывающий и закрывающий тег

Оцените статью
bestprogrammer.ru
Добавить комментарий