如何防止特定元素继承带有 * 符号的 CSS 规则?

Question

我已经定义了这个CSS规则：

*,
*::before,
*::after {
box-sizing: border-box
}

如果我们只想排除具有此类.testim的特定元素怎么办？

Answer 1

它非常简单;如果我纠正了，那么;

.testim,
.testim::before,
.testim::after{
box-sizing: unset;
}

如果未设置 CSS 关键字将属性重置为其继承值(如果属性自然继承自其父属性(，如果不是，则重置为其初始值。

有关 CSSunset值的详细信息。

Answer 2

:not()就像*。它选择除括号中的元素之外的每个元素。(https://developer.mozilla.org/en-US/docs/Web/CSS/:not(。

:not(.testim), *::before, *::after {
box-sizing: border-box;
}
div {
width: 200px;
border: 20px solid black;
}
.testim {
width: 200px;
border: 20px solid black;
}

<div>I am div with width: 200px and border: 20px.</div>
<hr>
<div class="testim">I am of the class testim with width: 200px and border: 20px.</div>