在HTML中，<pre>标签被用来定义预格式化的文本。预格式化文本是指那些保留空格和换行符的文本，通常用于显示计算机代码、地址或其他需要以特定方式展示的文本。理解<pre>标签以及与之相关的常用标签，对于编写结构和布局正确的网页至关重要。
<pre>标签
<pre>标签的基本功能是保持文本的空白符（如空格和换行）和格式。以下是一些关于<pre>标签的关键点：
- 保留格式：
<pre>内的文本会以等宽字体显示，并且空格和换行都会被保留。 - 内联元素：
<pre>是一个块级元素，这意味着它通常会占据整个屏幕宽度。 - 不支持内联元素：你不能在
<pre>标签内直接嵌套其他块级元素，但可以嵌套内联元素，如<a>、<img>等。
<pre>
function example() {
console.log("Hello, world!");
}
</pre>
常用支持标签对比
以下是一些与<pre>标签相似的常用标签，以及它们之间的对比：
<code>标签
<code>标签用于表示计算机代码的一部分。它和<pre>一样可以保留空白符，但<code>通常用于更小的代码片段。
- 保留格式：与
<pre>相同。 - 内联元素：
<code>是一个内联元素。
<code>console.log("Hello, world!");</code>
<samp>标签
<samp>标签用来表示计算机程序或文档样本的输出。它通常用于显示程序运行的结果或示例。
- 保留格式：与
<pre>相同。 - 内联元素：
<samp>是一个内联元素。
<samp>Example of sample output:</samp>
<var>标签
<var>标签用来表示变量。它通常用于数学或编程文档中。
- 保留格式：与
<pre>相同。 - 内联元素：
<var>是一个内联元素。
/var>x</var> = 10;
<kbd>标签
<kbd>标签用于表示用户必须按下的键盘按键或快捷键。
- 保留格式：与
<pre>相同。 - 内联元素：
<kbd>是一个内联元素。
To save the file, press <kbd>Ctrl + S</kbd>.
总结
虽然<pre>标签及其相关标签看起来很相似，但它们各自有不同的用途。<pre>通常用于长代码块或格式化的文本，而<code>, <samp>, <var>, 和 <kbd>则更适用于表示特定的内容，如代码片段、输出结果、变量或键盘快捷键。了解这些标签的正确使用方法可以帮助你创建更加清晰和易于理解的网页内容。