[class * =“span”]在twitter引导中是否还包含.row-fluid [class * =“span”]？

在Twitter的引导，我最近遇到这些类型的选择[class * =“span”]在twitter引导中是否还包含.row-fluid [class * =“span”]？

[class*="span"], 
.uneditable-input[class*="span"], 
.row-fluid [class*="span"] { 
    float: none; 
    display: block; 
    width: 100%; 
    margin-left: 0; 
    -webkit-box-sizing: border-box; 
    -moz-box-sizing: border-box; 
    box-sizing: border-box; 
}

我知道[class*="span"]意味着它具有内“跨度”一类的名称每一个元素，我很熟悉CSS的休息。

但是为什么我们还必须选择.row-fluid [class*="span"]当[class*="span"]适用于.row [class*="span"]？

我删除了这部分（因为我认为这将是多余的），但似乎浏览器不会选择带有span类名称的元素，如果它们在.row-fluid元素中。有人可以解释这种行为吗？

来源

2013-08-03 FatDog47

可能是一种特殊的黑客行为。 – BoltClock

@BoltClock有它，但我不会称它为黑客。检查http://coding.smashingmagazine.com/2007/07/27/css-specificity-things-you-should-know/如果您需要更多关于特异性的细节 - 不同的选择器会得到不同的权重。 –

感谢David Taiaroa（见他的评论下面的问题和他的信息链接），这种情况发生的原因是选择器规范优先。我认为后来定义的属性会覆盖之前的属性，但事实证明，更具体的选择器将覆盖更多的通用选择器，而不管放置在哪里。

在这种情况下，.row-fluid span1,.row-fluid span2等已被特别选择，以便在各种场所设置自举宽度。因此，[class*="span"]无法覆盖它们，因为它是更一般的选择器。这就是我们需要.row-fluid [class*="span"]来选择这些元素。

来源

2013-08-03 20:55:48 FatDog47

[class * =“span”]在twitter引导中是否还包含.row-fluid [class * =“span”]？

回答

相关问题