1. 首页
  2. 博客
  3. HTML <pre> 标签

HTML <pre> 标签

实例 预格式化的文本:

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

浏览器支持

Internet Explorer, Firefox, Opera, Google Chrome, Safari

目前大多数浏览器支持 <pre> 标签。

标签定义及使用说明

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

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

提示和注释

提示: <pre> 标签的一个常见应用就是用来表示计算机的源代码。

在HTML 4.01 与 HTML5中的差异

在 HTML 4.01 中，"width" 属性已废弃，不可使用。 HTML5 不支持"width"属性。

属性

属性  值   描述
width   number  HTML5 不支持该属性。HTML 4.01 已废弃该属性。 定义每行的最大字符数（通常是 40、80 或 132）。

2 篇笔记

pre元素是块级元素，但是只能包含文本或行内元素。也就是说，任何块级元素（常见为可以导致段落断开的标签）都不能位于pre元素中。
pre元素中允许的文本可以包含物理样式和基于内容的样式变化，还有链接、图像和水平分隔线。当把其他标签，比如<a>标签放到<pre>块中时，就像放在HTML/XHTML文档的其他部分中一样即可。
制表符tab在<pre>标签定义的块当中可以起到应有的作用，每个制表符占据8个字符的位置，但并不推荐使用tab，因为在不同的浏览器中，tab的表现形式各不相同。在用<pre>标签格式化的文档段中使用空格，可以确保文本正确的水平位置。
如果希望使用<pre>标签来定义计算机源代码，比如HTML源代码，请使用符号实体来表示特殊字符。一般将<pre>标签与<code>标签结合起来使用，以获得更加精确的语义，用于标记页面中需要呈现的源代码。
如果想要把某一段规定好的文本格式放在HTML中，那么就要利用pre元素的特性。
<pre>标签的定义及使用说明：

1、该标签可定义预格式化的文本，被包围在 pre 元素中的文本通常会保留空格和换行符，并且文本会呈现为等宽字体。该标签的一个常见应用就是用来表示计算机的源代码。

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

3、标签中的特殊符号被转换为符号实体，比如 "<" 代表 "<"，">" 代表 ">"。

4、可以导致段落断开的标签（比如<h1>、<p> 和 <address> 标签）尽量不要包含在 <pre> 所定义的块里，我试过现在的浏览器（Google、IE和火狐），虽然可以把段落结束标签解释为简单地换行，但是在代码编辑器里会报错 "Invalid location of tag (h1)."

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
</head>
<body>
   <pre>你好     我是Natalie

  我即将成为<h1>一名技术</h1>大神。

原文链接：https://codingdict.com/

热门标签