HTML <pre> Element
The HTML <pre> element represents preformatted text in which spaces, indentation, and line breaks are displayed as they appear in the HTML source.
Syntax
<pre>
Text is displayed
with spaces and
line breaks preserved.
</pre>The <pre> element requires both an opening and closing tag. Whitespace within the element is generally preserved instead of being collapsed as it normally is in HTML.
Attributes
The <pre> element supports the global HTML attributes. It does not have any element-specific attributes.
Example
This example uses the <pre> element to preserve the spaces, indentation, and line breaks of the text exactly as they are written.
Usage Notes
Use the <pre> element when the spacing and line breaks in the source are meaningful and should be preserved when the content is displayed.
Browsers typically display <pre> content using a monospace font and preserve sequences of spaces and line breaks. The appearance can be changed with CSS without removing the element's preformatted text behavior.
The <pre> element is commonly used for code samples, text-based diagrams, formatted data, and other content where whitespace is important.
When displaying computer code, place a <code> element inside the <pre> element so the markup identifies both the preformatted layout and the content as computer code.
HTML characters still need to be escaped when they should appear as text. For example, use < to display a less-than sign and > to display a greater-than sign in an HTML code example.
Accessibility
Preformatted text should remain understandable without relying only on visual spacing or alignment. Text-based diagrams and other layouts created with whitespace may be difficult for screen reader users to interpret.
When a <pre> element contains source code, combining it with a <code> element provides more meaningful HTML structure. If the content is complex, provide surrounding text that explains its purpose.
Browser Support
Baseline: Widely available indicates a feature has been supported by core browsers for at least 30 months. At this stage, the feature is considered stable and safe for most websites to use without needing to worry about compatibility issues or fallbacks, as it is supported by the vast majority of users' devices and browser versions.
For detailed browser compatibility information, see Can I Use: HTML <pre> Element .
Related Elements
The <pre> element is closely related to the <code> element for computer code, the <kbd> element for user input, and the <samp> element for sample computer output.