如何在 HTML 中引用（不是块引用）？

Posted 2023-02-24

【中文标题】如何在 HTML 中引用（不是块引用）？

【英文标题】：How to quote in HTML (not blockquote)?

【发布时间】：2011-01-15 18:31:19

【问题描述】：

我想在 html 页面中添加一些示例代码。我该怎么做，例如我想显示一个标签和图像标签，在***中我使用4个空格：

A Tag example:
<a href="your_url"></a>

Image Tag example:
<img...>

【参考方案1】：

要格式化输出，您可以使用pre 元素。

但是，您仍然需要将特殊字符 < > ' " & 转换为它们的 HTML 实体 < > 等等，以便 HTML 标记清晰可见文本并且不会被浏览器呈现。

如果您可以使用 PHP，则可以使用 htmlspecialchars()。每个服务器端脚本语言都有它的等价物。

在 JavaScript 中，设置 pre 容器的 innerText 属性会导致字符按字面意思显示，而不是解释为 HTML。

如果你想手动做，这是你需要转换的：

& to &
> to >
< to &lt;
" to &quot;
' to &#039

source

【参考方案2】：

我想您是在要求 <pre> 标记预格式化文本。

pre 标记内的所有内容都不会被解释。

在浏览器上试试这个：

<pre>
&lt;img src="whatever" /&gt;
&lt;othertag&gt;whatever&lt;/otherta&gt;
</pre>

编辑：正如 Pekka 指出的，对于 HTML 标签，符号必须转换为它们的 HTML 实体。

【讨论】：

不在我的浏览器中 - 我仍然得到一个解释图像。你确定这是正确的吗？ IIRC，无论如何，无论pre与否，您都需要使用控制字符制作HTML实体。

你是对的，符号必须转换成它们各自的 HTML 实体，很抱歉这个错误。

【参考方案3】：

您可以使用<pre> 和<code> 标记的组合。 <pre> 标记将其内部的所有内容格式化为源代码中显示的内容（用于显示大块源代码），<code> 标记用于代码的内联格式（类似于此答案中的标记的方式格式化）。此外，<code> 标记内的任何内容都需要转换为 HTML 特殊字符（例如 & gt; 和 & lt;）。