为什么＃选择器的特异性较低？ [英] Why is the # selector of lesser specificity than anything?

问题描述

大胆的大写锁定TL; DR：

我知道如何确定选择器的具体情况，我认为它使用了概略的假设，有了有效的理论关系，请不要回应解释W3计算规则的具体情况，请阅读问题< - 读取。

我一段时间，当我写一个样式的一些HTML，将类似于下面：

  ... 
< div id =outer> 
< span id =inner>< / span> 
< span>< / span> 
 ... 
< / div> 
 ... 
  

为什么特殊规则会使选择器#outer span比#inner？
ID是唯一的，所以当我说#inner我只能指一个元素，为什么它不那么具体？我理解关于确定特异性的规则，我只是想知道这是故意的还是偶然的，也如果有人知道我可以问这个问题的人谁写的CSS标准。

我应该注意，我明白我可以使用#outer #inner来确保最大的特异性，但似乎它首先违反了ID的目的。这也是一个有问题的解决方案，当我写模板，我不确定一个ID将在另一个。我不是在寻找一个解决方法，只是一个理论的答案。

我的问题是理论，完全基于设置逻辑。虽然我有，如果你为一个项目定义一个规则n个可能的项目，不是那么具体，你可以去吗？为什么CSS选择器的创建者制定一个可以定义m个可能项目的m个项目的规则，其中m是n的一个子集作为更具体的规则？

是#id将等价于通过名称识别1个项目，#id elm将通过其与项目的名称关系来识别组。

解决方案

我认为这样的想法是非常有用的。 为什么更多的是世代或权威的观点。如果 #Parent （任何一代的回报）说所有我的孩子符合资格x（在你的情况下， span ）将被赋予y的继承（无论css属性），单个个体 #Child 需要什么都不重要，它需要权限

在编辑时添加

： strong>内容 style 将是反叛的孩子，而！important 破解父类。 编辑：我保持幽默，但我不认为它反映了这个想法以及我以后的声明。

在评论中添加对问题的修改：给定：

  #outer span ... 
＃ inner（这是一个span元素）
  

然后为了确保#inner选择，我推荐：

  body span＃inner（* edit：*只是span＃inner works * edit：*如果稍后定义）
  

或给予身体id和

  #bodyId #inner 
  

当然，这些仍然可以覆盖。 代越多，越难以改变行为，因为代代相传（如果伟大的爷爷和爷爷和父母都同意，那么孩子很可能不会去做自己的事情） 。

我必须在稍后编辑时重写此部分。
给定此HTML：

 < div id =grandparent> 
< div id =parent> 
< div id =child>< / div> 
< / div> 
< / div> 
  

我之前说过 #parent div 具有比 #grandparent div 更大的权限。两者都具有代数权威，实际上是一个平等代数权威，但第一个是更近的一代胜利。 错误 的错误在于更接近代际上不是重要的，而是最后被授予权威。如果有相同的权威权力，自己指定的最后一个是赢得的。

我相信我仍然可以支持这个声明： child [id]（超过两个以前的选择器）将其属性视为更大的权限以便自己控制的规则的权限。 ＃＃已经赋予它权限，但是不足以覆盖早期一代的＃，如果该早期一代还携带另一个选择器授予更多权限。

因此 #grandparent div 超过 #child ，但不包括 div＃child 如果是最后一次接收权限[添加此项] ，而不是 #child [id] ，因为 [id] 为 #child 添加更多的权限来规则本身。



同样， style 属性设置一个样式属性本身真正的行为更像是一个至高无上的权威来自我管理，假设更多的！important 不会带走。

作为一个总结陈述，回答为什么是这样（而不是符合设置理论），我相信它不是关于精确特异性（尽管这是使用的术语），因为人们会期望 #ChildsName 是该事物中最后的唯一说法，因为没有什么更具体的需要。然而，尽管文档可能不会这样说，选择性实际上是基于授权权限。谁拥有最多的权利来统治元素，并给予一个领带，谁是最后一个被授予这些权利。

Big bold caps-lock TL;DR:

I KNOW HOW SELECTOR SPECIFICITY IS DETERMINED, I THINK IT USES FLAWED ASSUMPTIONS AND I CAN BACK MY IRRITATIONS UP WITH VALID SET THEORY RELATIONS, PLEASE DO NOT RESPOND EXPLAINING W3 CALCULATION RULES FOR SPECIFICITY, PLEASE READ THE QUESTION <- read that.

This has bothered me for some time, when I write a style for some HTML that would be similar to below:

...
<div id="outer">
    <span id="inner"></span>
    <span></span>
    ...
</div>
...

Why would specificity rules make the selector "#outer span" more specific than "#inner"? ID's are unique, so when I say "#inner" I can ONLY be referring to one element, so why is it less specific? I understand the rules on determining specificity, I just wonder if this was intentional or accidental, also if anyone knows how I can ask this question to the people who write the css standards.

I should note, I do understand that I COULD use #outer #inner to ensure maximum specificity, but that seems like it defeats the purpose of ID in the first place. This also is a problematic solution for when I write templates and I'm not sure that one ID will be inside of another. I'm not looking for a workaround, just a theory answer.

My question is theory, entirely based on set logic. The though I have is that if you define a rule for 1 item of n possible items, isn't that as specific as you can go? Why would the creators of CSS selectors make a rule that could define m items of n possible items, where m is a subset of n as a more specific rule?

My thought is that #id would be the equivalent of identifying 1 item by name, and #id elm would be identifying a group by its relation to an item by name. It's completely counter intuitive to call a named item less specific than an unnamed group with a named relation.

解决方案

I think the idea of "why" is more a "generational" or "authority" view point. If #Parent (of any generation back) says all my children who meet qualification "x" (in your case, span) are going to be given an inheritance of "y" (whatever css property), it doesn't matter what the single individual #Child wants, it needs the authority of the #Parent to get it if the parent has stated otherwise.

Added on edit: The inline style would then be the rebellious child, and the !important the crack down parent. Edit: I kept this for humor, but I don't think it reflects the idea as well as my later statement below.

Added on edit to question in comment: Given:

#outer span ...
#inner (which is a span element)

Then to help insure #inner selection I recommend:

body span#inner (*edit:* just span#inner works *edit:* if defined later)

or give body an id and

#bodyId #inner

Of course, these can still be overridden. The more "generations" involved, the more it becomes difficult to change the behavior because of the generational consensus (if great grandpa and grandpa and parent are all in agreement, it's likely the child is not going to get away with doing his own thing).

I had to majorly rewrite this section on later edit Given this HTML:

<div id="grandparent">
  <div id="parent">
    <div id="child"></div>
  </div>
</div>

I had previously stated that "#parent div has greater authority than #grandparent div. Both have generational authority, in fact, an 'equal' generational authority, but the first is 'nearer' generation" wins. The error in that is that "nearer" generationally is not what matters, but rather last to be granted authority. Given equal authority powers, the own designated last is the one that wins.

I believe I can still stand by this statement: With that thought in mind, a selector like #child[id] (which outweighs both previous selectors) treats its attributes as permissions for greater authority to rule that which itself controls. Having the # already gave it authority, but not enough to override a # of a earlier generation if that earlier generation also carries another selector granting more authority.

So #grandparent div outweighs #child but not div#child if it is last to receive authority [added this], and not #child[id] because the [id] adds greater authority for the #child to rule itself. If equal selectivity then last one to be granted authority wins.

Again, the style attribute setting a style property itself really acts more like a supreme granting of authority to rule oneself, assuming something more "!important" doesn't take it away.

As a summary statement to answer "why" it is this way (and not in line with "set" theory), I believe it is not about accuracy or really even specificity (though that is the term used) as indeed then one would expect #ChildsName to be the final unique say in the matter because nothing more specific need be said. Rather, however, while the documentation may not state it as such, "selectivity" is really structured on a granting of authority. Who has the most "rights" to rule the element, and given a "tie", who was the last one to be granted those rights.

这篇关于为什么＃选择器的特异性较低？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！