HTML Paragraphs

HTML, or HyperText Markup Language, is the standard language for creating web pages. One of the fundamental elements of HTML is the paragraph. Paragraphs help to organize text in a readable and logical format on a web page.

Creating a Paragraph

To create a paragraph in HTML, you use the  <p> tag. The text you want to include in the paragraph goes between the opening  <p>  tag and the closing  </p>  tag.

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

Multiple Paragraphs

You can create multiple paragraphs by using multiple  <p>  tags. Each set of  <p> tags represents a new paragraph.

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

Line Breaks

If you want to add a line break within a paragraph without starting a new one, you can use the  <br>  tag. This tag does not require a closing tag.

HTML
<p>This is the first line.<br>This is the second line in the same paragraph.</p>

Attributes of the <p> Tag

While the  <p>  tag itself is quite simple, it can also have attributes that modify its behaviour or style. Here are a few examples:

  • align : This attribute is used to set the alignment of the paragraph. It can take values like leftrightcenter, or justify.
HTML
<p align="center">This paragraph is centered.</p>
  • class : This attribute is used to apply CSS styles to the paragraph.
HTML
<p class="intro">This paragraph has a special class.</p>

Styling Paragraphs with CSS

CSS (Cascading Style Sheets) can be used to style HTML paragraphs. You can change the font, size, colour, and many other properties.

HTML
<style>
  p {
    color: blue;
    font-size: 16px;
  }
</style>
<p>This paragraph is styled with CSS.</p>

Example

Here’s an example of a complete HTML document with multiple paragraphs:

HTML
<!DOCTYPE html>
<html>
<head>
  <title>HTML Paragraphs Example</title>
  <style>
    .highlight {
      background-color: yellow;
      font-weight: bold;
    }
  </style>
</head>
<body>
  <p>This is the first paragraph on the page.</p>
  <p class="highlight">This is the second paragraph, highlighted with a CSS class.</p>
  <p>This paragraph
    has a line break.<br>
    See, it's on a new line!
  </p>
</body>
</html>

Summary

  • Use the <p> tag to create paragraphs in HTML.
  • <p> tags can contain text and other HTML elements.
  • Use the  <br>  tag for line breaks within a paragraph.
  • Apply CSS for styling and adding attributes to paragraphs.