Question

下面是一个非常简单的示例来演示此问题。

所有段落元素的样式都为红色，但是::after生成的内容应该不再变为红色。其颜色应该未设置。

为什么不起作用？

<!DOCTYPE html>
<html>
<head>
<style>
p {color:red}
p::after { 
  content: " and after";
  color: unset;
}
</style>
</head>
<body>
<p>before</p>
</body>
</html>

使用color之类的属性，可以手动指定至少一个不同的值。但是我遇到了一种情况，我想在元素上使用filter: brightness(1.2)，但不允许该过滤器影响::after的内容。

Answer 1

根据this：

unset是一个CSS值，如果一个属性是，则它与“继承”相同继承或“初始”（如果属性未继承）

由于after元素是从p元素继承的，因此unset将与inherit一样，颜色将与p标记一样是红色。 / p>

改为使用initial

<!DOCTYPE html>
<html>
<head>
<style>
p {color:red}
p::after { 
  content: " and after";
  color: initial;
}
</style>
</head>
<body>
<p>before</p>
</body>
</html>

为什么不能设置:: after伪元素上的值？

1 个答案: