幫助僞類，第一個孩子

Question

我正在使用有限訪問模板文件的CMS平臺，並且想要嘗試使用僞類控制某些佈局，但沒有運氣。任何人都可以看到這個結構有什麼問題，爲什麼我的僞類被忽略？

<div id="main"> 
    <div class="someRandomDiv"></div> 
    <div class="block"> 
    stuff 
    </div> 
    <div class="block"> 
    more stuff 
    </div> 
</div> 

，我想這樣的事情

#main .block {border: 1px solid blue} 
#main .block:first-child {border: 1px solid red} 

這個例子中，我會想的東西塊將有一個紅色的邊框和更多的東西會有一個藍色

左右，但一切只不過是藍色的。

感謝您的任何幫助。

Answer 1

它沒有被忽略，也就是沒有任何這有點違反直覺的比賽:)

我知道，但:first-child字面意思的父母，而不是類型的的第一個孩子，父母，所以在您的代碼中唯一匹配:first-child的是<div class="someRandomDiv"></div>。

隨着.block:first-child你說，有一類block和是他們的父母的第一個孩子，這不是說「第一個與block類」元素......他們自主選擇和Don」這裏重疊。所以，沒有匹配，因爲沒有元素符合兩個條件，這更有意義？

它不支持所有的瀏覽器，但你可以在jQuery中使用:nth-child()或JavaScript做你想做什麼，比如那就是：

$("#main .block:first").css({ border: '1px solid red' });