[分享]css不想要子级继承父级

在网页设计中，CSS是非常重要的一部分。它可以让我们展示出美观、舒适的网页，为用户提供良好的浏览体验。但是，有时候我们会碰到下面这种情况：.parent { color: red; } .child ...

在网页设计中，CSS是非常重要的一部分。它可以让我们展示出美观、舒适的网页，为用户提供良好的浏览体验。但是，有时候我们会碰到下面这种情况：

.parent {
    color: red;
}

.child {
    color: inherit;
} 

在这个例子中，我们为父元素设置了一个红色的字体颜色。然后，我们希望子元素也继承这个样式，在子元素中使用了inherit来继承color属性。我们发现，子元素的颜色并不是红色，而是父元素中的默认颜色（可能是黑色）。

为什么会这样呢？其实，这是由于CSS中的继承机制引起的。CSS中有一些属性是可以继承的，如字体、颜色、行高等属性。当我们要让子元素继承父元素中的样式时，我们只需要将子元素中相应的样式设置为inherit即可。但是有些时候，我们并不想要子元素继承父元素中的某些样式，这时该怎么办呢？

这时，我们可以使用CSS中的 unset 值。这个值会将被继承的属性重置为它们的初始值。比如：

.parent {
    color: red;
}

.child {
    color: unset;
} 

在这个例子中，我们为父元素设置了一个红色的字体颜色。然后，在子元素中使用了unset来重置color属性。这样，我们就可以达到不让子元素继承父元素中的样式的效果。

CSS中的unset值还可以应用在其他的属性上，比如：font-size、font-family 等等。总的来说，unset是一个非常强大的工具，可以帮助我们更好地控制网页的样式。