Geek Slack

Introduction to HTML
About Lesson



HTML Paragraphs


HTML Paragraphs

HTML paragraphs are defined with the <p> tag. A paragraph always starts on a new line and is usually used to hold blocks of text.

Syntax

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

Example

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

This code creates two paragraphs, each starting on a new line.

Rendering of Paragraphs

This is the first paragraph.

This is the second paragraph.

Usage Tips

  • Use paragraphs to separate blocks of text and make your content more readable.
  • Avoid using multiple <br> tags to create space between blocks of text. Instead, use paragraphs.
  • You can use CSS to style paragraphs, such as adding margins, changing font styles, or setting line heights.

Styling Paragraphs with CSS

<style>
p {
    color: #333;
    font-size: 1em;
    line-height: 1.5;
    margin: 10px 0;
}
.highlight {
    background-color: #ffff99;
    padding: 5px;
    border-left: 4px solid #ffeb3b;
}
</style>

This CSS code will style all paragraphs with a specific color, font size, and line height. Additionally, it defines a class .highlight for highlighting certain paragraphs.

Example with CSS

<p>This is a standard paragraph.</p>
<p class="highlight">This is a highlighted paragraph.</p>

This is a standard paragraph.

This is a highlighted paragraph.

Join the conversation