Preformat text

With the <pre> tag, the text renders in the browser exactly as you type it. The <pre> tag is short for preformat. So if you press the ENTER or RETURN key several times to create line breaks within a <pre> tag, you can expect to see all those line breaks in a browser.

The following shows the <pre> tag in use:

<pre> tag in use to preformat text
<pre> tag in use to preformat text

That prints:

This	is an

example of preformatted text.  The

text appears in the browsers exactly as

it is 	typed.

This example creates a tubular data:

Tabular data with pre tag
Tabular data with pre tag
A	|	B
C	|	DD

Notice the tabs and the line breaks in each example above are expectedly present in the output. However, the output of the <pre> tag is not guaranteed to remain as visualized for these reasons:

  1. The <pre> tag may produce different outputs on different browsers. Spaces and tabs may be interpreted differently on different browsers.
  2. The <pre> tag usually displays text in a monospaced font (i.e., Courier).

The use of <pre> tag is useful for displaying programming code.