HTML <pre> tag tutorial
The <pre> tag in HTML is used to define preformatted text. It displays text exactly as it is written within the tag, maintaining whitespace and line breaks. This tag is commonly used for displaying code snippets, text art, or any text where formatting is important.
Example:
Lorem ipsum dolor sit amet,
consectetur adipiscing elit,
sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
As you can see in the example above, the text is displayed exactly as it is written, with line breaks and spaces preserved.
Attributes of the <pre> tag:
| Attribute | Description |
|---|---|
style |
Specifies the style of the preformatted text |
class |
Specifies a class for the preformatted text |
Here is an example of using the <pre> tag with the <code> tag to display code:
<html>
<head>
<title>Sample Page</title>
</head>
<body>
<h1>Hello, World!</h1>
</html>
In the code example above, the HTML code is displayed exactly as written within the <code> tag, preserving the structure and formatting of the code.