JavaRush /Курсы /Модуль 1: Web Core /Форматирование текста в HTML

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

Модуль 1: Web Core
3 уровень , 9 лекция
Открыта

10.1 Начало форматирования

Форматирование текста с помощью тегов <b>, <strong>, <i>, <em>, <u> и <small> позволяет веб-разработчикам улучшать читаемость и акцентировать внимание на определенных частях текста. У каждого из этих тегов есть специфическое использование:

  • <b>: жирный текст без дополнительного значения
  • <strong>: жирный текст с акцентом на важность
  • <i>: курсивный текст для стилистического выделения
  • <em>: курсивный текст с логическим или смысловым акцентом
  • <u>: подчеркнутый текст для визуального выделения
  • <small>: мелкий текст для второстепенной информации

Понимание и правильное использование этих тегов помогает создавать более понятные и визуально привлекательные веб-страницы.

Основные теги для форматирования текста

Тег <b> и <strong>

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

HTML
    
      <p>Этот текст <b>жирный</b>, а этот текст <strong>очень важный и жирный</strong>.</p>
    
  

Тег <i> и <em>

Тег <i> используется для выделения текста курсивом без особого семантического значения. Тег <em> делает текст курсивом и указывает на акцент или важность текста.

HTML
    
      <p>Этот текст <i>курсивный</i>, а этот текст <em>очень важный и курсивный</em>.</p>
    
  

Тег <u> и <ins>

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

HTML
    
      <p>Этот текст <u>подчеркнутый</u>, а этот текст <ins>вставленный и подчеркнутый</ins>.</p>
    
  

Тег <s> и <del>

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

HTML
    
      <p>Этот текст <s>зачеркнутый</s>, а этот текст <del>удаленный и зачеркнутый</del>.</p>
    
  

Тег <mark>

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

HTML
    
      <p>Этот текст <mark>выделен</mark> для привлечения внимания.</p>
    
  

Тег <small>

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

HTML
    
      <p>Это основной текст, а это <small>мелкий текст</small>.</p>
    
  

Тег <sub> и <sup>

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

HTML
    
      <p>Это текст с подстрочным индексом H<sub>2</sub>O и надстрочным индексом x<sup>2</sup>.</p>
    
  

10.2 Разрывы строк

Тег <br>

Тег <br> используется для вставки разрыва строки, который переносит текст на новую строку без создания нового абзаца.

HTML
    
      <p>Это текст с разрывом строки<br>внутри одного абзаца.</p>
    
  

Тег <hr>

Тег <hr> используется для вставки горизонтальной линии, которая визуально разделяет контент на веб-странице.

HTML
    
      <p>Текст выше линии.</p>
      <hr>
      <p>Текст ниже линии.</p>
    
  
1
Задача
Модуль 1: Web Core, 3 уровень, 9 лекция
Недоступна
Теги <u> и <mark>
Теги <u> и <mark>
1
Задача
Модуль 1: Web Core, 3 уровень, 9 лекция
Недоступна
Теги <i> и <em>
Теги <i> и <em>
1
Опрос
Таблицы, 3 уровень, 9 лекция
Недоступен
Таблицы
Таблицы
Комментарии (3)
ЧТОБЫ ПОСМОТРЕТЬ ВСЕ КОММЕНТАРИИ ИЛИ ОСТАВИТЬ КОММЕНТАРИЙ,
ПЕРЕЙДИТЕ В ПОЛНУЮ ВЕРСИЮ
Олег Сычев Уровень 29
23 августа 2025
Закончил 5 уровень 23.08.2025.
Maksym Zhdanov Уровень 9
5 июня 2025
А вот это, если запускать с платформы
Ислам Уровень 18
2 сентября 2024
К этой самой важности можно было бы добавить про семантичное значение тегов (, ) и в принципе про скринридеры