問題描述
我看到這樣的選擇器,
.class1 .class2 .class3 {
}
這是什么意思?
我使用了多個沒有空格的類選擇器.空格表示后代,但對類沒有意義.
I've used multiple class selectors without spaces. Space means descendant but it doesn't make sense for classes.
推薦答案
假設有一個頁面帶有以下標記,
Let's say there's a page with the following markup,
<div class="class1">
<div class="class2">
<div class="class3">
Some page element(s).
</div>
</div>
</div>
您提供的 CSS 將為 class3 下的所有元素設置樣式,這些元素在 class2 下,在 class1 下.
The CSS you provided would style all elements under class3, which are under class2, which are under class1.
即假設這是樣式,
.class1 .class2 .class3{
color:red;
}
它將文本呈現為紅色,相當于以下內容,
It would render the text as red, which is the equivalent of the following,
div.class1 div.class2 div.class3 {
color:red;
}
最后,以下將無濟于事,
Finally, the following would do nothing,
.class1.class2.class3{
color:red;
}
如果標記如下,
<div class="class1 class2 class3">
Some page element(s).
</div>
它可以工作并將文本呈現為紅色.
It would work and render the text in red.
注意:<IE7 可能有上述問題...
http://www.thunderguy.com/分號/2005/05/16/multiple-class-selectors-in-internet-explorer/http://www.w3.org/TR/2004/CR-CSS21-20040225/selector.html#class-html
這篇關于CSS 選擇器中的多個類的文章就介紹到這了,希望我們推薦的答案對大家有所幫助,也希望大家多多支持html5模板網!