Тег HTML P - элемент Paragaph - httpdoc.ru

Тег HTML P - элемент абзаца

HTML-тег p определяет абзац на веб-странице. Это парный тег, то есть он имеет открывающий <p> и закрывающий </p> теги.

<p> Тег очень важен, так как все они написаны на веб - сайте необходимо получить отформатирован в виде абзацев. Браузеры автоматически добавляют пустые строки выше и ниже абзаца. Он отделяет парагаф от другого контента или других абзацев на странице.

Абзацы HTML - это элементы блочного уровня, т. Е. Новый абзац всегда начинается с новой строки. Кроме того, теги p автоматически закрываются, если перед </p> тегом вставляется другой блочный элемент .

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

Пример тега HTML p
<!DOCTYPE html> 
<html lang="en">
<head>
 <meta charset="UTF-8">
 <title> HTML Paragraph Tag </title> 
</head> 

<body> 

<p> This is First Paragraph </p> 
<p> This is Second Paragraph </p> 
<p> This is Third Paragraph </p> 

</body> 
</html>

Выход

HTML Paragraph Tag Example

Это первый абзац

Это второй абзац

Это третий абзац


Как HTML обрабатывает пробелы в абзаце

Если вы поместите много пробелов внутри тега HTML p, браузер удалит эти ненужные пробелы при отображении страницы. Браузер считает несколько последовательных пробелов и строк как один.

Вы можете добавлять пробелы и новые строки в абзац с помощью <pre> тега, но не практикуйте его незрело. Пространства на сайте будут плохо выглядеть. В приведенном ниже примере, как видно из результатов, все пространство игнорируется браузером.

Пример
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title> HTML Paragraph Tag </title> 
</head> 

<body> 

<p> This is First    Paragraph. </p>  
<p> This is Second Paragraph. </p> 
<p> This is Third Paragraph.</p>

</body> 
</html>

Выход

HTML Paragraph Tag Example

Это первый абзац.

Это второй абзац.

Это третий абзац.


HTML тег <pre>

Предварительный тег HTML определяет предварительно отформатированный текст. Текст внутри <pre> тега отображается шрифтом фиксированной ширины и сохраняет как пробелы, так и разрывы строк.

Предварительный тег - это парный тег; он отображает текст в том виде, в котором он был написан внутри тега. Браузер не пропускает последовательные пробелы или разрывы строк. Он используется для отображения блока кода языка программирования или для отображения стихотворения с правильными переносами строк.

В приведенном ниже примере вы можете видеть, что текст отображается в браузере как есть, как он был написан внутри тега pre.

Пример предварительного тега
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title> HTML Pre Tag </title> 
</head> 

<p>The pre tag preserves both spaces and line breaks:</p>

<pre>
   This is a Paragraph Tag.
   This is a Paragraph Tag.
   This is a Paragraph Tag.
   This is a Paragraph Tag.
</pre>

</body>
</html>

Выход

HTML Pre Tag Example
   Это тег абзаца.

   Это тег абзаца.

   Это тег абзаца.
   
   Это тег абзаца.

Примечание. Если вы хотите добавить дополнительное пространство за пределами абзаца, не используйте <br> тег. Вместо этого используйте CSS Margins, чтобы изменить пространство над / под абзацем.



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

Элемент
Microsoft Edge browser.png Край
Chrome browser.png Хром
Firefox browser.png Fire Fox
Opera browser.png Опера
safari browser.png Сафари
<pre>
да
да
да
да
да