| HTML | WebReference

Определяет текстовый абзац. Элемент <p> (от англ. paragraph — абзац, параграф) является блочным, всегда начинается с новой строки, абзацы текста идущие друг за другом разделяются между собой отбивкой. Величиной отбивки можно управлять с помощью стилей. Если закрывающего тега нет, считается, что конец абзаца совпадает с началом следующего абзаца или другого блочного элемента.

Синтаксис

<p>Текст</p>

Атрибуты

align
Определяет выравнивание текста.

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

Пример

<!DOCTYPE html> <html> <head> <meta charset=»utf-8″> <title>P</title> </head> <body> <p>Рекомендуется совершить прогулку на лодке по каналам города и Озеру Любви.</p> <p>Венгры страстно любят танцевать, особенно ценятся национальные танцы. </p> <p>Из первых блюд распространены супы-пюре и бульоны, но подают их редко.</p> </body> </html>

Результат данного примера показан на рис. 1.

Рис. 1. Абзацы текста

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

СпецификацияСтатус
WHATWG HTML Living StandardЖивой стандарт
HTML5Рекомендация
HTML 4.01 SpecificationРекомендация
Спецификация

Каждая спецификация проходит несколько стадий одобрения.

  • Recommendation (Рекомендация) — спецификация одобрена W3C и рекомендована как стандарт.
  • Candidate Recommendation (Возможная рекомендация) — группа, отвечающая за стандарт, удовлетворена, как он соответствует своим целям, но требуется помощь сообщества разработчиков по реализации стандарта.
  • Proposed Recommendation (Предлагаемая рекомендация) — на этом этапе документ представлен на рассмотрение Консультативного совета W3C для окончательного утверждения.
  • Working Draft (Рабочий проект) — более зрелая версия черновика после обсуждения и внесения поправок для рассмотрения сообществом.
  • Editor’s draft (Редакторский черновик) — черновая версия стандарта после внесения правок редакторами проекта.
  • Draft (Черновик спецификации) — первая черновая версия стандарта.

Браузеры

1121111
1161
Браузеры

В таблице браузеров применяются следующие обозначения.

  • — элемент полностью поддерживается браузером;
  • — элемент браузером не воспринимается и игнорируется;
  • — при работе возможно появление различных ошибок, либо элемент поддерживается с оговорками.

Число указывает версию браузреа, начиная с которой элемент поддерживается.

Текст

Практика

  • Абзацы
  • Добавление элемента
  • Картинки друг под другом
  • Открывающие и закрывающие теги
  • Открывающие теги
  • Ошибки в абзацах
  • Содержимое элемента

Элементы HTML

Атрибуты

Значения

Типы элементов

Аудио и видео

Документ

Изображения

Объекты

Скрипты

Списки

Ссылки

Таблицы

Текст

Формы

Фреймы

HTML тег

❮ Назад Вперед ❯

Тег <p> определяет параграф или текстовый абзац. Элемент является блочным, а значит его содержимое всегда начинается с новой строки и занимает всю доступную ширину. Следующие один за другим абзацы разделяются между собой отбивкой, величину которой можно задавать при помощи CSS свойства margin. Для перевода строки внутри абзаца используется тег <br>.

Пробелы между открывающим тегом <p> и его содержимым игнорируются браузером. Чтобы установить отступ (красную строку), используйте CSS свойство text-indent.

Текстовые абзацы и параграфы заключаются в открывающий (<p>) и закрывающий (</p>) теги. Если нет закрывающего тега нет, то считается, что конец абзаца совпадает с началом следующего блочного элемента.

Тег <p> не может содержать таблицы и другие блочные элементы.

Пример

<!DOCTYPE html>
 <html>
   <head>
      <title>Заголовок окна веб-страницы</title>
   </head>
   <body>
          <p>Это параграф</p>
   </body>
 </html>

Попробуйте сами!

Результат

Для выравнивания текста в абзаце вместо устаревшего атрибута align, необходимо использовать CSS свойство text-align.

Пример

<!DOCTYPE html>
<html>
  <head>
    <title>Заголовок окна веб-страницы</title>
    <style>
      div.paragraph {
        text-align: center;
      }
    </style>
  </head>
  <body>
    <h2>Заголовок окна веб-страницы</h2>
    <div>
      <p>Выравнивание текста по центру установлено при помощи CSS свойства text-align</p>
    </div>
  </body>
</html>

Попробуйте сами!

Результат

Тег <p> поддерживает также глобальные атрибуты и атрибуты событий.

Как добавить стиль к тегу <label> ?

Распространенные свойства для изменения визуальной насыщенности/выделения/размера текста внутри тега <label>:

  • CSS свойство font-style задает стиль шрифта: normal | italic | oblique | initial | inherit
  • CSS свойство font-family создает приоритетный список названий семейства шрифтов и/или общее имя шрифтов для выбранных элементов.
  • CSS свойство font-size задает размер щрифта.
  • CSS свойство font-weight устанавливает насыщенность шрифта.
  • CSS свойство text-transform задает регистр текста (заглавные или строчные буквы).
  • CSS свойство text-decoration устанавливает оформление текста. Оно является сокращенным свойством для text-decoration-line, text-decoration-color, text-decoration-style.

Цвет текста внутри тега <label>:

  • CSS свойство color определяет цвет контента и оформления текста.
  • CSS свойство background-color устанавливает фоновый цвет элемента.

Стили форматирования текста для тега <label>:

  • CSS свойство text-indent указывает размер отступа первой строки в текстовом блоке.
  • CSS свойство text-overflow указывает, как будет отображаться пользователю строчный текст, выходящий за границы блока.
  • CSS свойство white-space указывает, как будут отображены пробелы внутри элемента.
  • CSS свойство word-break указывает перенос строки.

Другие свойства для тега <label>:

  • CSS свойство text-shadow добавляет тень к тексту.
  • CSS свойство text-align-last выравнивает последнюю строку текста.
  • CSS свойство line-height устанавливает межстрочный интервал.
  • CSS свойство letter-spacing устанавливает расстояние между буквами/символами в тексте.
  • CSS свойство word-spacing устанавливает расстояние между словами в тексте.

Тег HTML p

❮ Назад Полный справочник HTML Далее ❯


Пример

Абзац размечен следующим образом:

Это какой-то текст в абзаце.

Попробуйте сами »

Ниже приведены дополнительные примеры «Попробуйте сами».

Определение и использование

Тег

определяет абзац.

Браузеры автоматически добавляют одну пустую строку до и после каждого

элемент.

Совет: Используйте CSS для оформления абзацев.

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

Элемент

 Да Да Да Да
Да

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

Тег

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

Атрибуты событий

Тег

также поддерживает атрибуты событий в HTML.

Другие примеры

Пример

Выровнять текст в абзаце (с помощью CSS):

Это какой-то текст в абзаце.

Попробуйте сами »

Пример

6 Стиль абзацы с CSS:





Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut Labore et dolore magna Аликва. Ut enim ad minim veniam, quis nostrud exercitation ullamco Laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidat non proident, sunt in culpa qui officia удостовериться, что анимация id est Laborum.


Попробуйте сами »

Пример

 Подробнее о абзацах:


Этот абзац
содержит много строк
в исходном коде, но браузер

игнорирует его.

Попробуйте сами »

Пример

Проблемы со стихотворением в HTML:


Моя Бонни лежит над океаном.
Моя Бонни лежит над морем.
Мой Бонни лежит над океаном.
О, верни мне мою Бонни.

Попробуйте сами »

Связанные страницы

Учебник HTML: HTML Paragraphs

Ссылка HTML DOM: Paragraph Object со следующими значениями по умолчанию:

Пример

p {
  display: block;
  Верхнее поле: 1em;
 нижнее поле: 1em;
  левое поле: 0;
  правое поле: 0;
}

Попробуйте сами »

❮ Предыдущая Полный справочник HTML Следующий ❯


ВЫБОР ЦВЕТА

Лучшие учебники
Учебное пособие по HTML
Учебное пособие по CSS
Учебное пособие по JavaScript
Учебное пособие
Учебное пособие по SQL
Учебное пособие по Python
Учебное пособие по W3. CSS
Учебное пособие по Bootstrap
Учебное пособие по PHP
Учебное пособие по Java
Учебное пособие по C++
Учебное пособие по jQuery

900364 HTML Reference
CSS Reference
JavaScript Reference
SQL Reference
Python Reference
W3.CSS Reference
Bootstrap Reference
PHP Reference
HTML Colors
Java Reference
Angular Reference
jQuery Reference


3 Top4 Examples Примеры HTML
Примеры CSS
Примеры JavaScript
Примеры инструкций
Примеры SQL
Примеры Python
Примеры W3.CSS
Примеры Bootstrap
Примеры PHP
Примеры Java
Примеры XML
Примеры jQuery

FORUM | О

W3Schools оптимизирован для обучения и обучения. Примеры могут быть упрощены для улучшения чтения и обучения. Учебники, ссылки и примеры постоянно пересматриваются, чтобы избежать ошибок, но мы не можем гарантировать полную правильность всего содержания. Используя W3Schools, вы соглашаетесь прочитать и принять наши условия использования, куки-файлы и политика конфиденциальности.

Copyright 1999-2023 Refsnes Data. Все права защищены.
W3Schools использует W3.CSS.

Тег HTML p — Изучите HTML

❮ Пред. Следующий ❯

Тег HTML

— это элемент уровня блока, который используется для определения абзаца текста на веб-странице. Он создает новую строку до и после элемента, занимая всю ширину родительского контейнера.

Этот семантический тег обычно используется для структурирования текстового содержимого веб-страницы, например статей, сообщений в блогах или описаний продуктов. Вы можете добавить другие теги HTML, такие как или внутри тега

для выделения или форматирования определенных слов или фраз в абзаце.

Правильно структурировать текстовый контент с помощью тега

очень важно, так как это может помочь улучшить доступность и удобство использования вашей веб-страницы. Средства чтения с экрана и другие вспомогательные технологии полагаются на семантические теги, такие как

, для точной интерпретации и представления контента пользователям.

Тег

идет парами. Содержимое записывается между открывающим (

) и закрывающим (

) тегами. Если закрывающий тег опущен, считается, что конец абзаца совпадает с началом следующего элемента уровня блока.

Пробелы между открывающим тегом

и его содержимым игнорируются браузером. Чтобы задать отступ, используйте свойство CSS text-indent.

Тег

не может содержать таблицы и другие элементы блочного уровня.

Пример тега HTML

:

 

  <голова>
    Название документа
  
  <тело>
    
Это абзац

Попробуй сам »

Результат

Чтобы выровнять текст в абзаце, вместо устаревшего атрибута align используйте свойство CSS text-align.

Пример HTML-тега

, используемого со свойством CSS text-align:

 

  <голова>
    Название документа
    <стиль>
      раздел. параграф {
        выравнивание текста: по центру;
      }
    
  
  <тело>
     
Название документа
 
    <дел>
      
Выравнивание текста по центру задается свойством CSS text-align

Попробуй сам »

Пример тега HTML

, используемого с тегом
:

 

  <голова>
    Название документа
  
  <тело>
    
 Внутри абзаца можно поставить тег <br />, 
 для переноса части текста на другую строку при необходимости.

    
Lorem ipsum, или lipsum, как его иногда называют, – это фиктивный текст, используемый при макетировании печатных, графических или веб-дизайнов. 
 Этот отрывок приписывается неизвестному наборщику в 15 веке, который, как полагают, перепутал части книги Цицерона «О Finibus Bonorum et Malorum» для использования в книге образцов шрифтов.

Попробуй сам »

Тег

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

Как оформить тег

?

Общие свойства для изменения визуального веса/выделения/размера текста в теге

:

  • Свойство CSS font-style устанавливает стиль шрифта. нормальный | курсив | наклонный | начальная | наследовать.
  • Свойство CSS font-family задает приоритетный список из одного или нескольких имен семейств шрифтов и/или общих имен семейств для выбранного элемента.
  • Свойство CSS font-size устанавливает размер шрифта.
  • Свойство CSS font-weight определяет, должен ли шрифт быть полужирным или толстым.
  • Свойство CSS text-transform управляет регистром текста и регистром символов.
  • Свойство CSS text-decoration определяет украшение, добавляемое к тексту, и является сокращенным свойством для text-decoration-line, text-decoration-color, text-decoration-style.

Цветной текст в теге

:

  • Свойство CSS color описывает цвет текстового содержимого и оформления текста.
  • Свойство CSS background-color устанавливает цвет фона элемента.

    No related posts.