p(HTML element)

Syntax

<p>

</p>

Description

The p
element is one of the most commonly used building blocks of HTML. When you
use the p element to begin a new paragraph in HTML, it
automatically creates some space above and below the content. This space
is applied by the browser’s built-in style sheets, but you can override it
as you see fit using CSS.

In XHTML, it’s necessary to wrap the
contents of a paragraph in opening <p> and closing
</p> tags, while in HTML 4 and earlier versions, it was
enough to signify a new paragraph using the opening
<p>—no closing tag was needed.

For example, this
markup would be perfectly valid in HTML 3.2:

<p>So, having failed miserably to manage something as simple as
"order a breakfast and pay for it," we set about our next task:
submitting a visa application for our impending visit to
Thailand. Heaven help us! We're not normally scatty like this,
so we really must have needed that breakfast!
<p>Thankfully, the rest of the day was nothing like our poor start.
We got the visa submitted and approved without a hitch, so
that's one less task for us to do now.

The same markup would
not be acceptable in XHTML, but this would:

<p>So, having failed miserably to manage something as simple as
"order a breakfast and pay for it," we set about our next task:
submitting a visa application for our impending visit to
Thailand. Heaven help us! We're not normally scatty like this,
so we really must have needed that breakfast!</p>
<p>Thankfully, the rest of the day was nothing like our poor start.
We got the visa submitted and approved without a hitch, so
that's one less task for us to do now.</p>

Importantly,
while the first example would fail validation as XHTML, the second example
will pass, and will also pass validation as HTML 3.2.

For
the purposes of forwards-compatibility and general good coding practice,
it’s advisable to use both the opening and closing tags even if you’re
writing a document that uses an earlier, looser HTML DTD, such as 3.2 or
4.01—this approach supports completeness, rather than shortcuts.

Some developers perceive similarities between
the p and the div elements, seeing
them as being interchangeable, but this isn’t the case. The
p element offers more semantic information (“this is a
paragraph of text, a small collection of thoughts that are grouped
together; the next paragraph outlines some different thoughts”), while the
div element can be used to group almost any elements
together. Indeed, it can contain almost any other element, unlike
p, which can only contain inline elements.

Example

p is used, quite
simply, to mark up paragraphs of text:

<p>This is a paragraph of text…</p>
<p>…and this is another paragraph.</p>

Use This For …

This element may contain any text content,
but it can’t include any block-level elements: only inline or phrase
elements can be included.

Compatibility

Internet Explorer

Firefox

Safari

Opera

Chrome

5.5

6.0

7.0

8.0

1.0

1.5

2.0

3.0

3.5

1.3

2.0

3.1

4.0

9.2

9.5

10.0

2.0

Full

Full

Full

Full

Full

Full

Full

Full

Full

Full

Full

Full

Full

Full

Full

Full

Full

It causes no
compatibility issues, and has excellent support across all tested
browsers.