HTML Paragraphs

🧾 What Is a Paragraph in HTML?

In HTML, the <p> tag is used to define a paragraph of text. It is a block-level element that automatically adds spacing above and below its content.

>>“Paragraphs bring structure and readability to your content.” 📚

🛠 Syntax

Basic Paragraph Tag

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

You should always use the <p> tag when writing paragraphs to ensure semantic meaning and accessibility.

🔎 Behavior

  • 🧱 It is a block-level element and takes full width.
  • 📏 Adds spacing by default (via browser styles).
  • ⛔ Does not allow other block-level elements inside.

🧪 Examples

Multiple Paragraphs

<p>This is the first paragraph.</p>
<p>This is the second paragraph, below the first one.</p>
Media content

Note

⚠️ Avoid using multiple line breaks (<br />) to create paragraphs. Always use <p> for semantic clarity.

🧠 Using Line Breaks

If you want a line break within a paragraph, use the <br /> tag:

Line Break in Paragraph

<p>
  This is line one.<br />
  This is line two.
</p>

Note

💡 Use <br /> sparingly — only when the line break is intentional and not suitable for a new paragraph.

📋 Paragraph Tag Attributes

AttributeDescription
idUnique identifier for the paragraph
classCSS class name to style the paragraph
titleTooltip text shown on hover
styleInline CSS styling

🎨 Styling Paragraphs

You can style paragraphs using CSS. Here’s an example:

Styled Paragraph

<p style="color: darkblue; font-size: 18px;">
  This is a styled paragraph.
</p>

Note

✅ Prefer using class with external CSS for larger projects instead of inline styles.

📚 Learn More

>>“HTML paragraphs are not just about text — they’re about giving your ideas space to breathe.” 🌬️