Actual use of Pre Tag in HTML with an example

In this tutorial, we will learn about Pre Tag in HTML. Its function is to keep the text format as it is. When CSS tags are applied to pre-tag, it gets changed.

Syntax for Pre Tag:

<p>
<pre>
<br>

It has both opening and closing tag.

How does it work in HTML?

  • Using Pre Tag in HTML
<!DOCTYPE>
<html>
<head>
<title> CodeSpeedy: Pre Tag in HTML </title>
</head>
<body>
<pre>
 Covid Era was the most challenging part of everyone life.  Is focused on the importance of good healthcare and good immunity. 
 We just hope it never return. Lockdown is   lifted everywhere and life is getting back to normal. School is opening, Work From 
 Home culture is vanishing,   
 Vaccination is gearing up, Covid cases are decreasing exponentially. Millions died in this era and
 many children lost their parents Hope Everything will be   fine.
</pre>
</body>
</html>

Output:

 Covid Era was the most challenging part of everyone life.   Is focused on the importance of good healthcare and good immunity. 
 We just hope it never return. Lockdown is   lifted everywhere and life is getting back to normal. School is opening, Work From 
 Home culture is vanishing,    
 Vaccination is gearing up, Covid cases are decreasing exponentially. Millions died in this era and 
 many children lost their parents Hope Everything will be   fine.

Spaces and next line are not ignored and the output looks in formatted as it is when pre tag is used.

  • Without Using Pre Tag In Html

<!DOCTYPE>
<html>
<head>
<title> CodeSpeedy: No Pre Tag in HTML</title>
</head>
<body> 
Covid Era was the most challenging part of everyone life.   Is focused on the importance of good healthcare and good immunity.  
We just hope it never return. Lockdown is    lifted everywhere and life is getting back to normal. School is opening, Work From  
Home culture is vanishing,
Vaccination is gearing up, Covid cases are decreasing exponentially. Millions died in this era and
many children lost their parents Hope Everything will be   fine.
</body>
</html>

Output:

Covid Era was the most challenging part of everyone life. Is focused on the importance of good healthcare and good immunity. We 
just hope it never return. Lockdown is lifted everywhere and life is getting back to normal. School is opening, Work From Home
culture is vanishing, Vaccination is gearing up, Covid cases are decreasing exponentially. Millions died in this era and many 
children lost their parents Hope Everything will be fine.

Space, new line and line break are ignored when pre tag is not used.

Leave a Reply

Your email address will not be published.