为啥 'foo bar' 和 'foo > bar' 在 CSS 中具有相同的特性？

Posted 2023-03-06

【中文标题】为啥 \'foo bar\' 和 \'foo > bar\' 在 CSS 中具有相同的特性？

【英文标题】：Why do 'foo bar' and 'foo > bar' have the same specificity in CSS?为什么 'foo bar' 和 'foo > bar' 在 CSS 中具有相同的特性？

【发布时间】：2011-12-27 03:57:16

【问题描述】：

我很好奇为什么使用> 或其他组合符不会影响CSS 选择器的specificity，即为什么div span（匹配div 内的跨度某处）和@987654325 @（匹配作为 div 的直接子元素的 span）在特异性方面被认为是相等的。

我确实意识到组合器的使用与特异性完全无关，但我想知道是否有某种原因。

【问题讨论】：

我假设这只是因为它们彼此一样具体...“span 是div 的后代”和“span 是一个孩子div”，而不是更具体的东西，例如“带有某个类名的 span 是 div 的子级”。

好吧，你可能会争辩说，div 内的 some span 并不像作为 div 的 immediate 子级的 span 那样具体

是的，非常正确。好问题！

我可以说“immediate child”是不必要的具体。

@Josh Stodola：该文档（或latest recommended revision）在哪里解释了为什么组合器不能增加特异性？

【参考方案1】：

这实际上已经在工作组邮件列表中提出，早在 this thread 中。

它基本上归结为，是的，直观地说，带有组合器的选择器看起来更具体，但是从当前算法扩展而来的算法，考虑到这一点变得比现在使用的“简单”三元组复杂得多，即对人们来说相当混乱。

最后，

虽然可能是这种情况，但这是 CSS2 中为数不多的事情之一 多年来一直可互操作地实施，因此不会 CSS2.1 的变化。

“如果它没有坏，就不要修理它。”似乎是最后的电话。