How to Write HTML Paragraphs and Include HTML Paragraph Breaks

How to Write HTML Paragraphs

Textual content in web pages is divided into HTML paragraphs. Web browsers add a margin (white space) after and before a paragraph automatically to separate them from one another.

To define a section of text as an HTML paragraph, you should use a pair of <p> tags:

<p>This is a paragraph.</p>

<p>This is also a paragraph.</p>

<p>This is yet another paragraph.</p>

Dividing your content into HTML paragraphs make it easier to read and access. Assistive technologies (e.g., screen readers) recognize them as well and allow their users to skip paragraphs.

Note: HTML paragraphs don't have any formatting – it must be added manually.

HTML Code for Line Break

When writing HTML paragraphs, you will notice simply pressing ENTER does not produce a new line. An HTML paragraph break is defined by the <br> element:

<p>You can<br>break a paragraph<br>using line breaks.</p>

You can use the <br> element whenever you need to add an HTML new line but not a new paragraph. As it is an empty element, it does not have a closing tag.

If you'd prefer to separate your paragraphs with a horizontal line instead of a simple HTML paragraph break, use the <hr> element:

<h1>Operating System</h1>
<h2>Mac OS</h2>
<p>A personal computer operating system developed and marketed by Apple Inc.</p>
<hr>
<h2>Windows</h2>
<p>A personal computer operating system developed, marketed, and sold by Microsoft Corporation.</p>

Pros

• Easy to use with a learn-by-doing approach
• Offers quality content
• Gamified in-browser coding experience
• The price matches the quality
• Suitable for learners ranging from beginner to advanced

Main Features

• Free certificates of completion
• Focused on data science skills
• Flexible learning timetable

GET 25% OFF

Pros

• Simplistic design (no unnecessary information)
• High-quality courses (even the free ones)
• Variety of features

Main Features

• Nanodegree programs
• Suitable for enterprises
• Paid Certificates of completion

UP TO 70% OFF

Pros

• A wide range of learning programs
• University-level courses
• Easy to navigate
• Verified certificates
• Free learning track available

Main Features

• University-level courses
• Suitable for enterprises
• Verified certificates of completion

FREE COURSES

Preformatting Text in HTML Paragraphs

By default, the text within the <p> element is displayed in one line. This causes issues when you need the text to conform to a specific format (e.g., a poem or a postal address)

You can keep the formatting with the <pre> element. It preserves spaces and text precisely as you typed them. The preformatted HTML paragraphs are displayed in a fixed-width font (usually Courier):

<p>Both line breaks and spaces are preserved by the pre tag:</p>

<pre>
  My Doggo is flying into space.
  My Doggo is flying into space.
  My Doggo is flying into space.
  Oh, where will my Doggo fly now.
</pre>

Note: you don't need to include HTML paragraphs element if you're using <pre>: preformatted text will count as a paragraph with unique formatting.

HTML Paragraphs: Useful Tips

• If you skip the <p> closing tag, the paragraph element will close automatically in HTML5. However, XHTML is stricter and doesn't allow omitting tags.
• You can separate your paragraphs with first-line indentation instead of margins by using the CSS text-indent property.
• If you need more blank space between paragraphs, use the CSS margin property. Don't add empty paragraphs, as it may confuse the users of assistive technologies.