如何在html网页中将html代码显示为文本

Question

我问我们如何在教程html网站上显示html代码，例如向用户展示如何建立链接？

<a href="#">text</a>

提前致谢

Answer 1

使用CDATASection。 CDATASection对象表示文档中的CDATA部分。

CDATA部分包含不会被解析器解析的文本。 CDATA部分内的标签不会被视为标记，实体也不会被扩展。

您可以在XML中使用它来获取示例：

<![CDATA[<tag>Some text</tag>]]>

它将解释为：

<tag>some text</tag>

或在程序输出中。使用CSS示例：

<style type="text/css">
/*<![CDATA[*/
body { background:black;  }     
/*]]>*/
</style>

希望这对你有所帮助。

Answer 2

使用HTML实体（https://developer.mozilla.org/en-US/docs/Glossary/Entity）。

E.g：

• < for＆lt;
• > for＆gt;

可以使用

<pre>，<code>或<xmp>，但存在兼容性问题。

示例：

1. <a href="#">text</a>

2. <span class="code"><span class="lt">&lt;</span>a href="#"<span class="gt">&gt;</span>text<span class="lt">&lt;</span><span class="fs">/</span>a<span class="gt">&gt;</span></span>

示例2的CSS：

.code {
    font-family:Courier;
    color:#DF42AA;
}
.lt, .gt, .fs{
    font-family:Courier;
    color:#032F82;
}

Answer 3

替换＆lt; <和＆gt;按>

Answer 4

使用CSS的另一种方法：

code::before { content:'<'; }
code::after { content:'>'; }

然后，您的HTML代码将是：

<code>a href="#"</code>text<code>/a</code>

来自this website about CSS（但法语）。

Answer 5

使用

< for < 和 >的{​​{1}}

快捷方式是“如果您将>用于<，而不将<用于>， 那么您的输出将与同时使用>和<一样。