你能阻止 CSS 样式继承父元素吗？

防止子元素继承 CSS 中的父级样式

问题：

有没有如何防止父元素上声明的 CSS 属性被子元素继承？例如，如果父元素的 font-size 为 12px，你能阻止它的子元素继承这个样式吗？

答案：

不幸的是，有没有简单的 CSS 属性可以让您阻止从父元素继承。但是，有几种可以实现的解决方法：

1. 手动恢复样式更改：

   您可以通过显式设置来覆盖继承的样式子元素所需的样式。例如：

   div { color: green; }
   
   form div { color: red; }
   
   form div div.content { color: green; }

2. 向标记添加多个类：

   如果您有权访问 HTML 标记，则可以添加多个元素的类以针对特定样式。这允许您覆盖继承类的样式：

   form div.sub { color: red; }
   
   form div div.content { /* remains green */ }

3. 使用 all: revert 属性（实验）：

   CSS 工作组提出了 all: revert 属性，它将元素上的所有样式重置为其初始值。这可用于防止从父元素继承：

   div.content {
     all: revert;
   }

   请注意，此属性仍处于实验阶段，可能并非所有浏览器都支持。

以上是你能阻止 CSS 样式继承父元素吗？的详细内容。更多信息请关注PHP中文网其他相关文章！