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

Синтаксис тега <p>

<p>Текст параграфа.</p>

Спецификация HTML

Тег является частью спецификации HTML Living Standard.

Семантический или нет

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

Примеры использования

Обычный параграф:

<p>Здесь какой-то текст.</p>

Несколько абзацев текста:

<p>Это первый параграф.</p>
<p>Это второй параграф.</p>

Параграф со встроенным стилем:

<p style="color: blue;">Этот параграф голубого цвета</p>

Параграф со ссылкой:

<p>Here's a link to <a href="https://www.google.com/">Google</a>.</p>

Параграф с подчеркнутым текстом:

<p>В этом параграфе <em>подчёркивание</em> текста.</p>

Параграф с полужирным текстом:

<p>В этом параграфе <strong>жирность</strong> текста.</p>

Параграф с изображением:

<p>В этом параграфе есть <img src="image.jpg" alt="image description"> картинка.</p>

Для чего использовать тег <p>

  • для разделения блоков текста на абзацы;
  • для добавления текстовых описаний к изображениям;
  • для добавления текстовых описаний к видео;
  • для написания содержания статей;
  • для написания постов для блога;
  • для описания продуктов.

Атрибуты тега <p>

У тега нет специфических атрибутов.

Глобальные атрибуты

Тег поддерживает все глобальные атрибуты HTML.

Ограничения

  • если внутри тега <p> нет содержимого, тег все равно создаст пустое пространство на веб-странице;
  • если содержимое внутри тега <p> содержит только пробелы или переносы строк, тег создаст пустое место на веб-странице.

Поддержка браузеров

Тег поддерживается всеми современными браузерами.

Актуальная информация — на сaniuse.

Чем заменить тег

В большинстве случаев тег <p> является наиболее подходящим для создания абзацев на веб-странице.

Однако если требуется создать блок текста без автоматического добавления пространства между абзацами, то можно использовать тег <div>. Если же необходимо выделить на странице отдельный блок с контентом, то лучше использовать теги <section> или <article>, в зависимости от смысла и содержания блока.

Актуальность

Тег не является устаревшим.


Хотите узнать больше об HTML-тегах?

Прочитайте справочник по HTML или познакомьтесь с вёрсткой на интерактивных тренажёрах в HTML Academy.


«Доктайп» — журнал о фронтенде. Читайте, слушайте и учитесь с нами.

ТелеграмПодкастБесплатные учебники

Читать дальше

<div>

Синтаксис, примеры использования, основные атрибуты.

  • 25 января 2023

<dl>

Синтаксис, примеры использования, основные атрибуты.

  • 25 января 2023

<option>

Синтаксис, примеры использования, основные атрибуты.

  • 25 января 2023

<ul>

Синтаксис, примеры использования, основные атрибуты.

  • 25 января 2023

<video>

Синтаксис, примеры использования, основные атрибуты.

  • 25 января 2023

<datalist>

Синтаксис, примеры использования, основные атрибуты.

  • 25 января 2023

<caption>

Синтаксис, примеры использования, основные атрибуты.

  • 25 января 2023