這兩種風格規則有什麼區別？

Question

可能重複：
CSS Child vs Descendant selectors

那麼，有什麼區別嗎？

div a { 
    /* Styles here */ 
} 

和

div > a { 
    /* Styles here */ 
} 

我真的不明白。

Answer 1

space是descendant combinator，而>是child combinator。 孩子意味着直接後裔，後裔意味着一個節點在父元素的子樹中某處，無論多深。

Answer 2

爲了把它在平原的話：

div a {/*properties*/} 

這將選擇和給定樣式應用到所有的「a」元素的「格」。

---

的 '>' 符號是 '兒童Combinator的'：

div > a {/*properties*/} 

這將選擇只有直接子的DIV中 'A' 的標籤。

例如：
CSS：

div > a {color: red} 

HTML：

<div> 
    <a href="#">Link One</a> 
    <span> 
     <a href="#">Link Two</a> 
     <a href="#">Link Three</a> 
    </span> 
    <a href="#">Link Four</a> 
</div> 

這裏，紅色將僅適用於 '鏈接一個' 和 '鏈接四'。 'Link Two'&'Link Three'未被選中，因爲它們嵌套在「span」元素中。

玩弄他們：http://dabblet.com/gist/3730661

您可以在此處詳細瞭解CSS選擇器：http://css-tricks.com/child-and-sibling-selectors/