Definition
The <p>
tag represents a paragraph.
Example
<p>
Lorem ipsum dolor sit, amet consectetur adipisicing elit. Cum doloribus
vitae non neque enim dicta? Quas corporis ducimus possimus. Molestiae
neque harum quo quia sint? Asperiores, debitis eius. Vel, nemo?
</p>
<p>
Quos nam et aliquam dolore velit praesentium, tempora fugit dolorem
laboriosam animi cumque ratione suscipit esse minus laborum molestiae aut
cupiditate harum consectetur nisi necessitatibus magni? Dicta, accusamus.
A, non?
</p>
<p>
Ipsa accusamus tempore laboriosam aliquam ex nesciunt, eum fuga voluptatem
est praesentium, illum repellat sequi nisi voluptatum amet quo iste?
Obcaecati optio rerum cum aut. Rerum at commodi rem eius!
</p>
Usage
- The opening tag is required. The closing tag can be omitted if the
<p>
element is immediately followed by an<address>
,<article>
,<aside>
,<blockquote>
,<div>
,<dl>
,<fieldset>
,<footer>
,<form>
,<h1>
,<h2>
,<h3>
,<h4>
,<h5>
,<h6>
,<header>
,<hr>
,<menu>
,<nav>
,<ol>
,<pre>
,<section>
,<table>
,<ul>
or another<p>
element, or if there is no more content in the parent element and the parent element is not an<a>
,<audio>
,<del>
,<ins>
,<map>
,<noscript>
, or<video>
element. - Browsers will automatically set a margin to increase spacing before and after a
<p>
element. You can adjust this using the CSSmargin
property. - List elements such as
<ul>
or<ol>
should not be children of<p>
elements. Instead you should close the<p>
tag, insert the list, then create a new<p>
after. For example, the following is correct:<p>There were a few things this sentence has relating</p> <ul> <li>bullets</li> <li>lists</li> <li>questions</li> </ul> <p>and is further discussed below.</p>
Attributes
The <p>
element only supports the Global Attributes.
Best Practices
- Assistive technology such as screen readers allows users the ability to skip to the next paragraph. Do not use empty
<p>
tags to add space between paragraphs, as this can cause issues for users using assistive technology.
Specification
Browser Support
Desktop
Chrome | Edge | Firefox | IE | Opera | Safari |
---|---|---|---|---|---|
Yes | Yes | Yes | Yes | Yes | Yes |
Mobile
Android Webview | Chrome Android | Firefox Android | Opera Android | iOS Safari | Samsung Internet |
---|---|---|---|---|---|
Yes | Yes | Yes | Yes | Yes | Yes |