如何在 div 中隔离 CSS 规则？

Question

我需要在以下伪页面的 div 中加载一个 html 页面：

<html>
    <head></head>
    <style>
        body {
            background-color: yellow;
        }
    </style>
    <body>
        <div style="display:none">
            <html>
                <head></head>
                <style>
                    body {
                        background-color: blue;
                    }
                </style>
                <body>
                    <div style="display:none">
                        ...
                    </div>
                </body>
            </html>
        </div>
    </body>
</html>

这段代码中自然发生的是背景会变成蓝色，因为它在页面中间发生了变化。 有没有办法隔离这个div？ 所以它的行为类似于 iframe。 div 内的内容存储在一个变量中，所以我认为我不能使用框架，因为 html 代码未存储在文件中以将其用作源。

谢谢！

Answer 1

由于安全风险，您不能将站点加载到没有 Iframe 的站点中。

您唯一可以做的就是使用服务器端脚本（如 php）加载外部站点，使用正则表达式切开头部，然后将其余部分发送到您的站点到您的 div 中。

Answer 2

这是错误的。 一个 HTML 文档只能有一个 html 标签和一个 body 标签，否则就是一个无效文档，浏览器是不允许的。

相反，如果您加载 iframe，它将拥有自己的 #document，这很好。

如何在 div 中隔离 CSS 规则？

问题描述

2 个解决方案

解决方案1
2 2016-04-28 08:28:37

解决方案2
2 已采纳 2016-04-28 08:30:09

如何在 div 中隔离 CSS 规则？

问题描述

2 个解决方案

解决方案1 2 2016-04-28 08:28:37

解决方案2 2 已采纳 2016-04-28 08:30:09

解决方案1
2 2016-04-28 08:28:37

解决方案2
2 已采纳 2016-04-28 08:30:09