Paragraphs

The <p> element is used to define a paragraph in HTML.
Paragraphs are block-level elements and always start on a new line.
Most browsers automatically add white space (also called margins) before and after each paragraph.

Basic Syntax

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

Multiple Paragraphs

  <p>This is the first paragraph.</p>

  <p>This is the second paragraph.</p>

Tips

• Use separate <p> tags for separate blocks of text.
• Paragraphs cannot contain other block-level elements like <div>, <table>, etc.
• You can style paragraphs using CSS for margins, line height, font size, etc.

Example

Output :

Display

In HTML, you cannot control exactly how content will appear on every screen.
Different devices such as large desktops, small phones, or resized browser windows may display elements differently.

Adding extra spaces or blank lines in your HTML code will not affect the actual output on the browser.
Browsers treat multiple spaces or line breaks as a single space unless styled or formatted otherwise.

Output :

Horizontal Rules

The <hr> tag defines a thematic break in an HTML document.
It is commonly displayed as a horizontal line, and is used to separate sections or indicate a change in topic.

Syntax

  <hr>

Example

Output :

Line Breaks

The <br> tag in HTML is used to insert a line break within a block of text.
It allows content to continue on a new line without starting a new paragraph.

When to Use

• Inside poems or addresses where new lines are required
• Inside a single paragraph where line breaks improve readability

Syntax

  <br>

Example

Output :

<pre> Element in HTML

The <pre> element is used to display preformatted text.
Text inside a <pre> block retains all spaces and line breaks exactly as written in the HTML source.
It is usually shown in a monospace (fixed-width) font like Courier.

When to Use

• To show computer code or command-line output
• To display poetry, ASCII art, or formatted data
• Anytime you want to preserve whitespace formatting

Syntax

  <pre>
  
Line 1 of text  
    Line 2 with spaces  
Line 3 on a new line  
  
  </pre>

Output Preview

Line 1 of text  
    Line 2 with spaces  
Line 3 on a new line  

Key Points

• <pre> preserves formatting: spaces, tabs, and new lines.
• Often used together with <code> for displaying code samples.
• You can apply CSS to style the font, size, color, background, and more.

Output 5: