CSS3：not（）选择器

Question

在以下情况下，如何使用:not()排除div.note em加粗？

div#content em {
    font-weight: bold;
}

/* I want to remove the following 
   in favor of the :not selector being applied to the above */
div#content div.note em {
    font-weight: normal;
}

PS：这是一个精简的示例，我实际上在div#content em中有许多样式，我想要应用于除div.note em之外的所有内容。这就是为什么我不想在以后手动覆盖它们的原因......

Answer 1

如果您知道#content和.note之间的确切层次结构，则可以使用子选择器使否定具体到足以工作。如果.note是#content的孩子，则使用：

#content > :not(.note) em, #content > em {}

如果<div>和#content之间有两个.note，请执行以下操作：

#content > div > div > :not(.note) em, #content > em {}

你可能最好不要使用你拥有的东西，而只是覆盖作为.note后代的em元素。