<p>
- 25 января 2023
Тег <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.
«Доктайп» — журнал о фронтенде. Читайте, слушайте и учитесь с нами.
Читать дальше


Как правильно добавить секцию на страницу. Тег <section>
Синтаксис, примеры использования, основные атрибуты.
- 25 января 2023