HTML Paragraphs
Working with text content and paragraphs
đ What are HTML Paragraphs?
HTML paragraphs are used to display blocks of text. The <p> tag defines a paragraph and automatically adds space before and after the content.
<p>This is a paragraph of text.</p>
<p>This is another paragraph with more content.</p>
<p>Paragraphs are separated by default spacing.</p>
Output:
This is a paragraph of text.
This is another paragraph with more content.
Paragraphs are separated by default spacing.
Paragraph Features
Basic Paragraph
Simple text blocks
<p>Hello World!</p>
Line Breaks
Force line breaks with <br>
<p>Line 1<br>Line 2</p>
Styled Paragraphs
Add colors and formatting
<p style="color: blue;">Blue text</p>
Text Alignment
Center, left, or right align
<p style="text-align: center;">Centered</p>
đš Line Breaks and Spacing
Control how text flows within paragraphs:
<!-- Paragraph with line breaks -->
<p>
First line of text<br>
Second line of text<br>
Third line of text
</p>
<!-- Multiple paragraphs -->
<p>This is the first paragraph.</p>
<p>This is the second paragraph.</p>
Output:
First line of text
Second line of text
Third line of text
This is the first paragraph.
This is the second paragraph.
đš Paragraph Styling
Style paragraphs with colors, fonts, and alignment:
<p style="color: red; font-size: 18px;">Large red text</p>
<p style="text-align: center; background-color: yellow;">Centered with yellow background</p>
<p style="font-family: Arial; font-weight: bold;">Bold Arial font</p>
<p style="text-align: right; color: blue;">Right-aligned blue text</p>
Output:
Large red text
Centered with yellow background
Bold Arial font
Right-aligned blue text
đš Preformatted Text
Use <pre> to preserve spacing and line breaks:
<pre>
This text preserves
all spacing
and line breaks
exactly as written.
</pre>
Output:
This text preserves
all spacing
and line breaks
exactly as written.