如何在 <code>/<pre> 标签中按字面显示 <div> 标签？

Question

我在 <code> <pre> 在我的博主博客上显示代码。不幸的是，它不适用于 HTML 标签。有什么方法可以在 <pre> 或 <code> 标签内显示“ <div> ”，而不实际将其解释为 HTML？这就是我现在所做的：

 <pre>
 <code>
 .class {
   color:red;
 }
 // I would like HTML code inside this
 </code>
</pre>

除了 HTML 之外，它适用于所有内容。知道如何实现这一目标吗？谢谢。

原文由 Loolooii 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

不幸的是，它不适用于 HTML 标签。

<code> 表示“这是代码”， <pre> 表示“此标记中的空格很重要”。两者都不意味着“不应将此元素的内容视为 HTML”，因此两者都可以完美地工作，即使它们并不代表您想要的意思。

有什么方法可以在 <pre> 或 <code> 标记内显示“ <div> ” --- 而无需将其实际解释为 HTML？

If you want to render a < character then use < , with > for > and & for & 。

您不能（在现代 HTML 中）编写标记并将其解释为文本。

原文由 Quentin 发布，翻译遵循 CC BY-SA 3.0 许可协议

Answer 2

看起来只读文本区域几乎可以满足您的需求。

 <textarea readonly> <!-- html code --> </textarea>

原文由 Jason Wilkins 发布，翻译遵循 CC BY-SA 3.0 许可协议