CSS股利，類和跨越

Question

能有人請expalin我這兩個選擇，我不能讓我的頭周圍

div.card div 

div.card div span 

Answer 1

看http://www.w3schools.com/cssref/css_selectors.asp

WHI因爲div.card div的意思是「一個div的後代（例如，小孩，孫子，曾孫）的一個類別爲card」的分隔符。 div.card div span的意思是「一個跨度，是一個div類的後裔，是類card的div的後裔。」

由於HTML：

<div id="d1" class="foo"> 
    <div id="d2" class="card"> 
    <span id="s1"></span> 
    <div id="d3" class="bar"></div> 
    <div id="d4" class="bar"> 
     <div id="d5"><span id="s2"></span></div> 
    </div> 
    </div> 
</div> 

的選擇div.card div將匹配的ID d3，d4和d5的div。請注意，它與card div（id d2）本身不匹配。

選擇器div.card div span將匹配跨度，編號爲s2，但不是s1。 s1範圍不是從div.card的孩子的div下降，因此它不匹配。

Answer 2

div.card格 - 所有的div內分度類card

div.card格跨度 - 跨度所有的內部div的內分度類card

Answer 3

從右邊讀：第一個是「內部的div（帶有'卡'的div'）」。第二個是「跨越裏面的div（div與類'卡'）」。

Answer 4

在HTML這樣的：

div.card格

<div class="card"> 
    <div></div> 
</div> 

div.card格跨度

<div class="card"> 
    <div> 
     <span></span> 
    </div> 
</div>