Horje
HTML <pre> Tag

The <pre> HTML element represents preformatted text which is to be presented exactly as written in the HTML file. The text is typically rendered using a non-proportional, or monospaced, font. Whitespace inside this element is displayed as written.

Definition and Usage

The <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:

Tag Description
<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

Global Attributes

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


Event Attributes

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


How to add HTML <pre> Tag

It is Preformatted a text.
index.html
Example: HTML
<pre>
Text in a pre element
is displayed in a fixed-width
font, and it preserves
both      spaces and
line breaks
</pre>

Output should be:

How to add HTML <pre> Tag

How to create a pre-formatted text with a fixed width (with CSS)

See the Example and Learn More.

index.html
Example: HTML
<h2>Standard pre</h2>
<pre>This is a standard pre. It will use as much space as it needs.</pre>

<h2>Fixed width pre</h2>
<div style="width:200px;overflow:auto">
<pre>This is a pre with a fixed width. It will use as much space as specified.</pre>
</div>

Output should be:

How to create a pre-formatted text with a fixed width (with CSS)

How to set Default CSS Settings on HTML pre Tag

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

index.html
Example: HTML
<style>
pre {
  display: block;
  font-family: monospace;
  white-space: pre;
  margin: 1em 0;
} 
</style>
<pre>
Text in a pre element
is displayed in a fixed-width
font, and it preserves
both      spaces and
line breaks
</pre>

Output should be:

How to set Default CSS Settings on HTML pre Tag




html pre

Type:
Develop
Category:
Web Tutorial
Sub Category:
HTML Tag
Uploaded by:
Admin


Read Article
https://develop.horje.com/learn/1434/reference