- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
我写了一个 Google Chrome 扩展程序,它会弹出一个带有自动完成字段的对话框,它有自己的风格,但有些网站我的 CSS 完全损坏,看起来不太好。
我知道如何使用 iFrame 隔离样式,但在 Google Chrome 扩展程序中,无法以这种方式隔离我的 HTML 和 CSS。另一种方法是将我所有的东西包装到一个单独的 div 中,它有自己的 id 和该 id 的相对样式,我这样做了,但它似乎在某些带有“硬”标签样式重载或“! CSS 代码中的重要”指令。
所以,我想知道有什么方法可以方便地真正隔离我的样式,或者我的坏习惯是重载每个小 CSS 属性来修复每个站点的一个或另一个样式问题?
顺便说一句:我将我的 list 设置为加载“document_end”处的所有内容,但我发现它没有应用于每次 DOM 准备就绪时加载的样式表。
最佳答案
在提出问题时,您唯一的选择是使用 iframe 或具有非常高 specificity 的样式表并显式设置所有可能影响样式的属性。最后一种方法很麻烦,因为总会有一些属性被你忽略。因此,隔离样式表的唯一可用方法是使用 iframe。
这个问题的解决方案 - 没有 iframe 的样式隔离 - 是 Shadow DOM (since Chrome 25)。您可以在 HTML5 Rocks 找到教程。 .有关使用 Shadow DOM 隔离样式的真实世界 Chrome 扩展,请参阅 Display #Anchors (source code here)。
关于css - 如何在 Google Chrome 扩展中真正隔离样式表?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/55416520/
我是一名优秀的程序员,十分优秀!