Question

我知道这是可能的，因为这个网站做到了，但我尝试研究如何获得一堆垃圾，所以如何在没有浏览器将其解释为代码的情况下将标签添加到网站段落。

例如，如果我有<p><div></div></p>，我希望div在浏览器中显示为文本而不是浏览器将其解释为html。这样做很复杂吗？

我一直在为学校编写教程，如果我可以用文本形式直接将代码添加到网页而不是图像，那将更容易，因此学生可以复制并粘贴它。

Answer 1

看看这个网站本身是如何实现的：

<p>For example, if I have <code>&lt;p&gt;&lt;div&gt;&lt;/div&gt;&lt;/p&gt;</code>, I want the div to display in the browser as text not have the browser interpret it as html. Is this complicated to do?</p>

你需要替换＆lt;和＆gt;使用他们的HTML字符实体。

Answer 2

有很多种方法可供使用：

将<替换为<

`&lt;h1>This is heading &lt;/small>&lt;/h1>`

将代码放在</xmp><xmp>代码

中

<xmp>
    <ul>
        <li>Coffee</li>
        <li>Tea</li>
    </ul>
</xmp>

我不推荐其他方式，因为它们不适用于<plaintext>或<listing>等所有浏览器。

Answer 3

您想要查看名为HTML Entities的内容。

例如，如果您希望<字符出现在网站上，则可以编写此HTML代码：<。这些是五个基本HTML Entities及其源代码等价物：

< &lt;
> &gt;
" &quot;
' &apos;
& &amp;

如果您使用的是编程语言（例如PHP或ASP.NET），那么可能会有一个内置命令可以为您进行转换（htmlspecialchars()和Server.HtmlEncode ）。

Answer 4

要在网页中添加纯文本代码，我们需要在外文中为这五个字符执行 HTML字符转义：

< as < > as > & as & ' as ' " as "

（OR）

我们可以直接使用<xmp>标记，如：

<xmp>Code with HTML Tags like <div> etc. </xmp>

然而，

<xmp>标签会扰乱风格并且已经过时。

Answer 5

在重新格式化的文本块之前使用标记<PRE>，之后使用</PRE>。这些标记之间的文本呈现为等宽字符，其中包含换行符和空格，与原始文件中的点相同。这可能有助于在不添加大量HTML代码的情况下呈现诗歌。试试这个：

Mary had a little lamb. 
    Its fleece was white as snow.
And everywhere that Mary went
    the lamb was sure to go.

Answer 6

使用标记的html实体/特殊字符，例如<（小于）

&lt;p&gt; in html -> <p> in browser

您也可以写<p>，因为开头标记没有歧义。

许多语言都内置了转换HTML特殊字符的方法，例如php htmlspecialchars

Answer 7

您需要转义HTML标记，即小于号。将其写为<，它将显示为＆lt;在HTML页面上。

Answer 8

你的html不需要在标签中。如果您使用＆lt;＆gt;如果我要在句子的中间写<br>，那么你会把它转换成代码而不是文本的标签你会这样做你需要在代码中写代码这样说，使用＆lt; ＆GT; (< >) 然后你得到你需要的东西。

Answer 9

您还可以查看语法高亮显示，具体取决于您需要在网页上插入未解释代码的频率。以下是比较流行的一个：

http://alexgorbatchev.com/SyntaxHighlighter/

Answer 10

在不使用实体重新格式化文本的情况下，最简单的方法是使用JQuery。

<div id="container"></div>

<script>
    $('#container').text("<div><h1>Hello!</h1><p>I like you.</p></div>");
</script>

如果您执行alert($('#container').prop('innerHTML'));，则会获得<div><h1>Hello!</h1><p>I like you.</p></div>

该技术的实用程度取决于材料的来源。

Answer 11

我刚刚在CSS-Tricks上发现了一个更简单的解决方案...... 只需让你最外面的包装器成为'pre'标签，然后是'code'标签，然后在代码标签内放置你的代码。

Answer 12

使用iframe和txt文件： <iframe src="html.txt"></iframe>

如何在网页中添加纯文本代码？

12 个答案: