Skip to main content

HTML Paragraphs | Create Structured Content with HTML Paragraph Tags

Paragraphs are used to group together one or more sentences or lines of text that form a cohesive unit of meaning. Paragraphs are defined using the <p> element.

As an example:

<p>This is an example of a paragraph.</p>

In this example:

  • The text "This is an example of a paragraph." is the content of the paragraph.
  • The opening <p> tag and closing </p> tag define the boundaries of the paragraph.

HTML Display​

HTML ignores extra spaces and newlines (also known as whitespace) in your code when rendering a web page, so adding extra spaces or newlines within your HTML code won't change the way the web page is displayed.

As an example

The following two code snippets would render the same way on a web page.

<p>This is some text.</p>

<p>This is some text      .</p>
tip

Adding a non-breaking space (&nbsp;) or using the <br> element to insert line breaks can be used to create specific spacing or formatting effects.

HTML Horizontal Rules​

Horizontal rule is a visual element that is used to separate content on a web page. It is typically represented as a horizontal line that spans the width of the container element.

To create a horizontal rule in HTML, you can use the <hr> tag, which stands for "horizontal rule".

As an example:

Editor

Loading...

In this example:

  • The <hr> tag is used to create a horizontal line between two paragraphs of content.
  • By default, the horizontal line will be centered within the container element and take up the full width available.

HTML Line Breaks​

To create a line break using the <br> element, you simply insert it where you want the line break to occur.

As an example:

Editor

Loading...

In this example

  • The <br> element is used to create a line break between the two lines of text within the <p> element.

HTML <pre> Element​

The <pre> element (short for "preformatted text") is used to display text in a fixed-width font, with all whitespace and line breaks preserved exactly as they appear in the HTML code.

This can be useful when you need to display text that is formatted in a specific way, such as code snippets, ASCII art, or other types of text that rely on whitespace or line breaks to be properly displayed.

As an example:

Editor

Loading...

In this example:

  • The text within the <pre> element is displayed in a fixed-width font, with each line of text appearing exactly as it does in the HTML code.
  • Any extra spaces, tabs, or line breaks are preserved, which can be useful for displaying code or other types of text that rely on whitespace for formatting.