HTML Paragraphs

A paragraph in HTML is a distinct block of text that is separated from adjacent text by blank lines -- just like paragraphs in a book. Paragraphs are defined with a <p> tag.

HTML Tutorial

Example

Two paragraphs in an article.

Dutch Art

Many painters, sculptors and architects of the seventeenth century are called "Dutch masters", while earlier artists are generally referred to as part of the "Netherlandish" tradition. An individual work's being labeled or catalogued as "Dutch School" without further attribution indicates that an individual artist for the work cannot be ascertained.

The Hague School of the 19th century re-interpreted the range of subjects of the Golden Age in contemporary terms, and made Dutch painting once again a European leader. In the successive movements of art since the 19th century, the Dutch contribution has been best known from the work of the individual figures of Vincent van Gogh and Piet Mondrian, though both did their best work outside the Netherlands, and took some time to be appreciated. Amsterdam Impressionism had a mainly local impact, but the De Stijl movement, of which Mondrian was a member, was influential abroad.

<article>
  <h2>Dutch Art</h2>
  <p>
    Many painters, sculptors and architects of the seventeenth 
    century are called "Dutch masters", while earlier artists 
    are generally referred to as part of the "Netherlandish" 
    tradition. An individual work's being labeled or catalogued 
    as "Dutch School" without further attribution indicates that 
    an individual artist for the work cannot be ascertained.
  </p>
  <p>
    The Hague School of the 19th century re-interpreted the range 
    of subjects of the Golden Age in contemporary terms, and made 
    Dutch painting once again a European leader. In the successive  
    movements of art since the 19th century, the Dutch contribution 
    has been best known from the work of the individual figures 
    of Vincent van Gogh and Piet Mondrian, though both did their 
    best work outside the Netherlands, and took some time to be 
    appreciated. Amsterdam Impressionism had a mainly local impact, 
    but the De Stijl movement, of which Mondrian was a member, 
    was influential abroad.
  <p>
</article>

Using paragraphs

Paragraphs are defined with the <p> tag.

In addition to text, a paragraph can also contain images, lists, media, input forms, and others.

The <p> tag is a block-level element, just like <div>.

For more information about the paragraph tag, see our HTML p Tag Reference Guide.

HTML Line Breaks

The <br /> tag forces a line break.

All lines in this paragraph are forced to wrap with a <br /> at the end.

Golden Age

Dutch Golden Age painting was among the most acclaimed
in the world at the time, during the seventeenth century.
There was an enormous output of painting, so much so that
prices declined seriously during the period. From the 1620s,
Dutch painting broke decisively from the Baroque style
typified by Rubens in neighboring Flanders into a more
realistic style of depiction, very much concerned with the
real world.

<article>
  <h2>Golden Age</h2>
  <p>
   Dutch Golden Age painting was among the most acclaimed <br />
   in the world at the time, during the seventeenth century. <br /> 
   There was an enormous output of painting, so much so that <br /> 
   prices declined seriously during the period. From the 1620s, <br /> 
   Dutch painting broke decisively from the Baroque style <br /> 
   typified by Rubens in neighboring Flanders into a more <br /> 
   realistic style of depiction, very much concerned with the <br /> 
   real world. 
  </p>
</article>

For more information about the line break tag, see our HTML br Reference Guide.


The <pre> paragraph tag

The HTML <pre> tag defines a paragraph with pre-formatted text.
It displays text exactly as it was entered, including empty lines and spaces.

A <pre> element that displays JavaScript code.

 class Polygon {
  
  constructor(height, width) {
    this.name = 'Polygon';
    this.height = height;
    this.width = width;
  }

  say() {
    console.log('I am a ', this.name + '.');
  }
 }
<pre>
 class Polygon {
  
  constructor(height, width) {
    this.name = 'Polygon';
    this.height = height;
    this.width = width;
  }

  say() {
    console.log('I am a ', this.name + '.');
  }
 }
</pre>

Tip:   The <pre> tag is ideal for displaying formatted code, such as HTML, CSS, SQL, etc.

For more information about the <pre> tag, see our HTML pre Reference Guide.


You may also like

Guides