11

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

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

我一直在为学校写教程，如果我可以将代码直接以文本形式而不是图像的形式添加到网页中，这样学生就可以复制和粘贴它会容易得多。

4

11 回答 11

14

看看这个网站本身是如何做到这一点的：

<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>

您需要将 < 和 > 替换为它们的 HTML 字符实体。

于 2013-02-18T03:57:12.670 回答
8

使用方法有很多：

  1. 替换<为&lt;

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

  2. 将代码放在</xmp><xmp>标签内

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

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

于 2016-01-02T17:25:24.923 回答
6

你想研究一个叫做HTML Entities.

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

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

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

于 2013-02-18T04:01:09.957 回答
4

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

玛丽有只小羊羔。
    它的羊毛像雪一样白。
玛丽去过的所有地方
    小羊肯定会去的。

于 2015-03-22T20:13:20.190 回答
4

要在网页中添加纯文本代码，需要对五个字符进行HTML 字符转义：

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

（或者）

<xmp>标签也可以用作替代品，这个标签扰乱了风格并且已经过时了。

<xmp>Code with HTML Tags like <div> etc. </xmp>
于 2017-06-11T04:23:37.060 回答
1

使用标签的html实体/特殊字符，如&lt;（for less than）

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

你也可以写&lt;p>，因为开始标签没有歧义。

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

于 2013-02-18T03:56:49.473 回答
0

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

于 2013-02-18T03:58:27.163 回答
0

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

于 2013-02-18T04:41:54.457 回答
0

我刚刚在 CSS-Tricks 发现了一个更简单的解决方案......只需让最外层的包装器成为“pre”标签，然后是“code”标签，然后在代码标签内将代码放在括号中。

于 2015-04-16T19:27:46.563 回答
0

无需使用实体重新格式化文本的最简单方法是使用 JQuery。

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

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

如果你这样做alert($('#container').prop('innerHTML'));，你会得到&lt;div&gt;&lt;h1&gt;Hello!&lt;/h1&gt;&lt;p&gt;I like you.&lt;/p&gt;&lt;/div&gt;

该技术的有用程度在某种程度上取决于您的材料来自何处。

于 2015-09-17T06:22:32.780 回答
0

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

于 2019-06-06T22:59:37.017 回答