当前位置： 移动技术网 > IT编程>网页制作>CSS > HTML的(pre>标签中嵌套HTML标签时被解析的解决方案

HTML的(pre>标签中嵌套HTML标签时被解析的解决方案

2018年02月08日  | 移动技术网IT编程  | 我要评论

1. 概述

标签中保留空格和换行，常用来展示代码片段，但如果直接嵌套HTML标签，会被浏览器解析，所以需要使用转义字符将代码片段转换为不被解析的文本。

2. 示例

我想显示以下代码片段：

<html>
    <head>
        <meta charset="utf-8">
        <title>Wechat</title>
    </head>
    <body>
         <iframe src="https://wx.qq.com/"/>
     </body>
</html>

用<pre>包裹后：

<pre>
    <html>
        <head>
            <meta charset="utf-8">
            <title>Wechat</title>
        </head>
        <body>
             <iframe src="https://wx.qq.com/"/>
        </body>
    </html>
</pre>

那么浏览器将直接打开微信扫码登录页面，而这并不是我想要的效果。 

正确的操作是将整个文本转义（网上很多在线转义工具）后放入<pre>标签：

<pre>
    &lt;html&gt;
        &lt;head&gt;
            &lt;meta charset=&quot;utf-8&quot;&gt;
            &lt;title&gt;Wechat&lt;/title&gt;
        &lt;/head&gt;
        &lt;body&gt;
            &lt;iframe src=&quot;https://wx.qq.com/&quot;/&gt;
        &lt;/body&gt;
    &lt;/html&gt;
</pre>

您可能感兴趣的文章:

如对本文有疑问， 点击进行留言回复！！

相关文章:

验证码：
最近更新的文章
大家感兴趣的文章
移动技术网