如何得到所有子元素不包括孫子

在這裏看到：http://jsfiddle.net/QVhAZ/4/如何得到所有子元素不包括孫子

如何使用*但只能有它適用於直接孩子？在這個例子中，我希望它只適用於「子」div s，而不是「孫子（不應該是紅色）」div s。

我不想一類適用於每個「孩子」 div，我想是說：

div#Root *:depth(1) 
{ 
    color: red; 
}

來源

2011-06-14 Josh M.

同樣的例子我的瀏覽器回答。如果您在IE6中檢查@easwee回答，它將無法工作。用我的答案吧。 – Alex 2011-06-14 15:46:41

您的意思是？

div {margin:20px;} 

div#Root > div {color:red;} 

div#Root > div > div {color:black;}

http://jsfiddle.net/QVhAZ/20/

還使用*選擇器選擇不僅div的，但是所有元素 - 它也慢得多，因爲它必須解析所有。請注意，顏色仍然會被所有孩子繼承，因此您必須指定您想要用於所有其他顏色的顏色。

來源

2011-06-14 15:32:46 easwee

+1表示特定問題的示例和示例。我鼓勵你增加更多的細節到你的答案，以便存檔的目的。 – 2011-06-14 15:37:30

@Jason McCreary - 我想，但似乎我不能編輯 - 有些鍵不能在編輯器中工作 - 稍後再試。 – easwee 2011-06-14 15:39:11

是的，'''選擇器是我正在尋找的。謝謝。 – 2011-06-14 16:35:32

如果你想直接孩子然後使用child selector：

div > * { 
    /* styles for all direct children of div */ 
}

注意：color屬性自動級聯，所以這變得有點棘手。你將不得不重置財產孫子（見easwee的答案）。但要證明這確實是要走的路，看border正常運作 - http://jsfiddle.net/QVhAZ/22/

來源

2011-06-14 15:30:44

試試這個

div#Root > * 
{ 
    color: red; 
}

來源

2011-06-14 15:31:21 Pantelis

也許你應該看看CSS Selectors參考。

element1 > direct-child { 
}

來源

2011-06-14 15:31:44

如果你希望它在所有的瀏覽器（最明顯的是IE6），你應該給大孩子的div的ID，這樣你就可以關閉孩子給出的例如任何樣式：

HTML

<div> 
    <div class="child"> 
    <div class="grandchild"></div> 
    <div class="grandchild"></div> 
    <div class="grandchild"></div> 
    </div> 
    <div class="child"> 
    <div class="grandchild"></div> 
    <div class="grandchild"></div> 
    <div class="grandchild"></div> 
    </div> 
</div>

風格

.child{margin-left:10px;} 
.grandchild{margin-left:0px;}

位煩人，但它ð OES保證它工作在不支持CSS選擇器如div > *

這裏是@easwee使用，只有tweeked所以如果你很在意IE6我會用它工作在IE6 http://jsfiddle.net/ajthomascouk/QVhAZ/24/

來源

2011-06-14 15:35:48 Alex

如何得到所有子元素不包括孫子

回答

相關問題