html <pre>标签的作用及使用方法详解

作者:前端大神~ | 时间:2019-05-08

html <pre>标签在代码中起到一个什么效果,都有什么作用呢?下面我就详细给大家讲解下它的作用和用法。

作用和用法

<pre> 标签可定义预格式化的文本。

被包围在 <pre> 标签 元素中的文本通常会保留空格和换行符。而文本也会呈现为等宽字体。


提示:

pre元素是块级元素,但是只能包含文本或行内元素。也就是说,任何块级元素(常见为可以导致段落断开的标签)都不能位于pre元素中。

pre元素中允许的文本可以包含物理样式和基于内容的样式变化,还有链接、图像和水平分隔线。当把其他标签,比如<a>标签放到<pre>块中时,就像放在HTML/XHTML文档的其他部分中一样即可。

实例代码

<!DOCTYPE html>
<html>
<head> 
<meta charset="utf-8"> 
<title>我有答案(woyoudaan.cn)</title> 
</head>
<body>

<pre>
此例演示如何使用 pre 标签
对空行和    空格
进行控制
</pre>

</body>
</html>

显示效果如下:

html <pre>标签的作用及使用方法详解

以上就是html <pre>标签的作用及使用方法的详细说明,希望通过上面的讲解,大家能够快速掌握它的用法。