html - 忽略部分 HTML 文档的样式表规则

Question

我有一个查看器选项卡，它显示从服务器获取的完整 HTML 文档。该应用程序有一个 css[ main.css ] 应用于屏幕上的所有元素。如果我们将此应用于查看器中显示的 HTML 文档，那么我们会丢失一些格式，例如表格边框消失。所以我们不希望应用程序的 main.css应用于查看器内容。我们想按原样显示文档。我看到 CDATA 可用于执行此操作。查看器中的内容包裹在 <div class="ap-mainPanel ap-scrollPanel"> 下所以我想转义里面的所有内容<div class="ap-mainPanel ap-scrollPanel">使用 main.css 渲染

    <![CDATA[
        <div class="ap-mainPanel ap-scrollPanel">
        </div>
    ]]> 

不确定我们如何指定我们想要 <div class="ap-mainPanel ap-scrollPanel"> 中的所有内容避免应用 main.css

Answer 1

您有 3 个主要选项:

1. 在 <iframe> 中显示该选项卡- 因为它不接受父文档风格
2. 重新申请main.css清除内容的规则 .ap-mainPanel , 一种“CSS重置”
3. 或在main.css中预定义已经定义的规则不适用在您的面板中 ( not() pseudo-class )