CSS/SASS選擇間接子女的第一次發生

我想選擇元素的第一次出現，即<main/>的間接子女。我不介意爲了使用SASS/SCSS語法來實現，如果這是目前唯一的辦法：CSS/SASS選擇間接子女的第一次發生

<style> 
    main header:first-of-type { 
    color: red; 
    } 
</style> 
<main> 
    <div> 
    <header>I'm red</header> 
    <header>I'm black</header> 
    <div> 
     <header>I'm black</header> 
    </div> 
    </div> 
    <div> 
    <header>I'm black</header> 
    </div> 
</main>

來源

2016-12-05 Sprout Coder

究竟是什麼？「間接孩子「？你的例子中的「間接孩子」會是什麼？ – j08691

你嘗試過'main div> header：first-of-type'嗎？這應該選擇main內的div內的第一個頭元素。 –

你描述的只是'：first-of-type'的問題......它查看父類中的第一個類型，在這種情況下將包含兩個結果。我能看到做到這一點的唯一方法是通過JavaScript（或某個框架）放置某種標記（基於類），以確保只有一個結果。 – rfornal

-1

使用選擇的main > * header:first-of-type

main > * header:first-of-type { 
 
    color: red; 
 
}

<main> 
 
    <div> 
 
    <header>I'm red</header> 
 
    <header>I'm black</header> 
 
    </div> 
 
    <header>I'm black</header> 
 
</main>

來源

2016-12-05 17:35:31 jafarbtech

你的答案適用於特定的元素樹。看到我更新的樹。我希望它適用於任何樹形結構。 –

我想你沒有別的選擇，除了使用jQuery來切換一些基於'first（）'元素的選擇器 – jafarbtech

CSS/SASS選擇間接子女的第一次發生

回答

相關問題