HTML <pre> Tag

If this site has been useful, we’d love your support! Consider buying us a coffee to keep things going strong!

Description

The <pre> tag in HTML is used to display preformatted text. Text enclosed within a <pre> element preserves both spaces and line breaks exactly as they are written in the HTML code. This is in contrast to normal HTML text, where sequences of whitespace characters are collapsed into a single space, and line breaks are ignored.

Because of this behavior, the <pre> tag is particularly useful for displaying content where the formatting is important, such as:

Code snippets
Poetry
ASCII art
Tabular data created with spaces

By default, text within a <pre> element is rendered using a monospace (fixed-width) font, which ensures that each character occupies the same amount of horizontal space. This makes it easier to maintain alignment for things like columns or diagrams.

The <pre> tag also respects the order of content, making it ideal for text where indentation, spacing, or alignment conveys meaning. Unlike <code> or <span>, which are used to semantically indicate code or inline content, <pre> is about the preservation of formatting rather than just the type of content.

Properties

Permitted Parents: Any element that accepts flow content
Content: Most inline tags and text
Start/End Tags: Start tag: required, End tag: required

Example

HTML

<pre>

Text in a pre element

is displayed in a fixed-width

font, and it preserves

both      spaces and

line breaks

</pre>

Result

Editor

Attributes

None

Global Attributes

The <pre> tag also supports the Global Attributes in HTML5

Event Attributes

The <pre> tag also supports the Event Attributes in HTML5

Browser Support

The following information will show you the current browser support for the HTML <pre> tag. Hover over a browser icon to see the version that first introduced support for this HTML tag.