像 normalize.css 这样的 CSS 重置会传播到影子 dom 吗？答案

【问题标题】：Do CSS resets like normalize.css propagate to the shadow dom?像 normalize.css 这样的 CSS 重置会传播到影子 dom 吗？
【发布时间】：2016-12-10 20:44:39
【问题描述】：

像 normalize.css 这样的 CSS 重置是否会传播到 shadow dom？例如，如果在Polymer 应用程序/项目中使用normalize.css，整个dom 和shadow dom 中的所有元素都会应用normalize.css 重置吗？

TIA, 奥莱

【问题讨论】：

为什么不测试一下看看呢？
主要问题是css 文件。 Polymer 不推荐在其元素中使用外部 css 文件，并且 normalize 是一个外部 css 文件
有一个工具可以从外部样式创建样式模块。
不完全是一个工具，而是来自 PolymerLabs 的网络服务Polystyles

标签： css polymer reset shadow-dom

【解决方案1】：

简短的回答是否定的。

您可以使用all: initial; 重置组件内的所有样式。

"...父页面中的规则比 :host,... 具有更高的特异性，这允许用户从外部覆盖您的顶级样式。"

因此，如果您在 :root 或 html 上设置样式，将会进入 shadowDOM

【讨论】：

【解决方案2】：

否（除非它们是默认继承的）。

因为 Shadow DOM 将 CSS 样式与主文档隔离开来，所以在您的 Shadow DOM 中不会考虑 normalize.css 中定义的任何内容。

【讨论】：

... 除非您将其添加到组件样式中
根据@ebidel 继承的 CSS 属性继续在影子 dom 内部继承。 Supersharp 你想更新答案吗？