Question

我想我发现了一个错误：不是选择器而且我不确定在CSS中提交错误的位置？

text-decoration将应用于：not

中的元素

看到我放在一起的这个小编码器，颜色是正确应用的，但下划线不是。

https://codepen.io/miketricking/pen/YWKGyJ

＆＃13;

p {
    color: #000000;
}

:not(p) {
    color: red;
    text-decoration: underline;
}

＆＃13;

<h1>This is a heading</h1>

<p>This is a paragraph.</p>
<p>This is another paragraph.</p>

<div>This is some text in a div element.</div>

＆＃13;

Answer 1

文本修饰正在应用于body和html，以及 h1和div。所有四个元素匹配：不是（p）。来自正文的装饰正在传播到p元素，这就是为什么你看到一个红色下划线（因为它的color: red声明用于渲染下划线）。这不是任何浏览器中的错误或规范中的错误 - 相反，这是stated very deliberately in the spec。

您可以通过将body添加到选择器来解决此问题，但它只适用于顶级p元素，而不适用于其他匹配的元素：not（p）并传播它们文字装饰无论如何：

＆＃13;

p {
    color: #000000;
}

body :not(p) {
    color: red;
    text-decoration: underline;
}

＆＃13;

<h1>This is a heading</h1>

<p>This is a paragraph.</p>
<p>This is another paragraph.</p>

<div>This is some text in a div element.</div>

＆＃13;

不幸的是，您不能阻止文本装饰传播到您的p元素而不更改其显示类型并在此过程中破坏您的布局。请参阅this answer。

：不是和文字装饰的bug？在哪里发送

1 个答案: