爲什麼不這個CSS：第一個孩子選擇器工作？

我正在開發一個Asp.Net MVC 3項目，並且遇到了一堵磚牆，爲什麼這不起作用，就像我認爲應該這樣。爲什麼不這個CSS：第一個孩子選擇器工作？

我的標記是：

<fieldset> 
    <input type="hidden" value="2"> 
    <div class="editor-label"> 
     <label for="Name"> Name</label> 
    </div> 
    ... 
</fieldset>

我的CSS是：

.display-label, .editor-label 
{ 
    margin: 0.8em 0 0 0; 
    font-weight: bold; 
    display: inline; 
} 

fieldset > div:first-child 
{ 
    margin: 0; 
}

所有我想要做的就是在字段集的第一個div都爲0保證金我認爲選擇fieldset > div:first-child會將樣式應用於「字段集的第一個孩子，其類型是div」，但顯然有些東西在逃避我。

我試過這個在IE9/FF/Chrome中，所以它不是一箇舊的瀏覽器搞亂我的選擇器。

謝謝。

來源

2011-09-28 Alex Moore

嘗試fieldset> div.editor-label：第一個孩子{margin-top：0} – albert

似乎在這裏工作http://jsfiddle.net/VcRyL/檢查你的CSS看看是否沒有一個屬性規則覆蓋這條規則 –

@AndreDublin不起作用：http://jsfiddle.net/5dAKL/1 –

fieldset > div:first-child的意思是「選擇的fieldset如果這是一個div的第一個子元素」。

這並不意味着「選擇fieldset中的第一個div」。

這種情況下的第一個孩子是<input type="hidden" value="2">。

要選擇div而不更改HTML，則需要使用fieldset > div:first-of-type。

不幸的是，雖然:first-child被廣泛支持，但:first-of-type只適用於IE9 +和其他現代瀏覽器。

因此，在這種情況下，最好的解決方法是繼續使用fieldset > div:first-child，並簡單地移動<input type="hidden" value="2">，這樣它就不是第一個孩子了。

來源

2011-09-28 21:33:43 thirtydot

啊，這樣做更有意義。我不知道''div：first-child'也意味着「_IF_它是一個div」，我只是認爲它總是選擇了第一個匹配的孩子。我將不得不重新安排標記，因爲我的客戶暫時停留在IE8上。謝謝！ –

爲什麼不這個CSS：第一個孩子選擇器工作？

回答

相關問題