Simple CSS for Styling pre html tag
Styling <pre> tag using simple css code
Description of <pre> tag on HTML
The HTML <pre> tag is employed for indicating preformatted
text. The code tag surrounds the code being marked up.
Browsers commonly render pre text during a fixed-pitched font, with
whitespace in tactfulness, and while not word wrap.
Example
<!DOCTYPE html>
<html>
<head>
<title>HTML pre Tag</title>
</head>
<body>
<pre>
This text is
in a fixed-pitch
font, and it preserves
both spaces and line breaks
</pre>
</body>
</html>
This will produce following result:
This text is
in a fixed-pitch
font, and it preserves
both spaces and line breaks
In this article i'll share the simple way / simple code CSS for styling of <pre> HTML tag.
The CSS:
Here the test code from jsfiddle (CSS and HTML) section tabs.
The CSS:
pre{background: rgb(248, 248, 248); border-color: rgba(17, 17, 17, 0.0392157) rgba(17, 17, 17, 0.0392157) rgba(17, 17, 17, 0.0392157) rgb(32, 142, 214); border-radius: 4px; border-style: solid; border-width: 1px 1px 1px 5px; box-sizing: border-box; clear: both; color: #4d4e53; font-family: Menlo, Monaco, Consolas, 'Courier New', monospace; font-size: 13px; line-height: 28px; margin-bottom: 30px; overflow: auto; padding: 15px; tab-size: 4; word-break: break-all; word-wrap: normal;}
Here the test code from jsfiddle (CSS and HTML) section tabs.
I Hope That Code may help you
0 Response to "Simple CSS for Styling pre html tag"
Post a comment
Jangan Lupa Cek Box "Notify Me" agar tahu komentar kamu dibalas oleh saya.
If there are any posts that are missing, or error or anything else, please leave a comment for the article / post to be fixed.
Do not Forget Check Box "Notify Me" to know our comments replied by me.