HTML PRE Tag

Jun 4, 2023
HTML PRE tag
 
The <pre> tag html element represents preformatted text. 

HTML pre tag Example

Preformatted text with html <pre> tag:

<pre>
Text in a pre element
is displayed in a fixed-width
font, and it preserves
both spaces and
line breaks
</pre>


Pre Tag Definition and Usage

The html <pre> tag defines preformatted text.

Text in a <pre> element is displayed in a fixed-width font, and the text preserves both spaces and line breaks. The text will be displayed exactly as written in the HTML source code.

Also look at:

TagDescription
<code>Defines a piece of computer code
<samp>Defines sample output from a computer program
<kbd>Defines keyboard input
<var>Defines a variable

Browser Support

Edge browserOpera browserChrome browser HTMLSafari browser HTML <pre srcset=“>Firefox browser HTML <pre srcset=“>

Global Attributes

The <pre> tag also supports the Global Attributes in HTML.


Event Attributes

The <pre> tag also supports the Event Attributes in HTML.


More HTML <pre> tag Examples

Example

How to create a pre-formatted text using CSS with a fixed width:

<div style=”width:200px;overflow:auto”>
<pre>This is a html pre with that has been set to a fixed width of 200 pixels. It will use as much space as specified.</pre>
</div>


Default CSS Settings

Most browsers will display the <pre> element with the following default values:

Example

pre {
  display: block;
  font-family: monospace;
  white-space: pre;
  margin: 1em 0;
}