父母選擇器的用例

CSS中有一個“家長選擇器”，因為CSS真正使用的東西可以定期提及。我覺得自己自己有很多想法，但是當我要求大腦使用用例時，我很難想到一個。好吧，我只是有一個，所以我以為我會在這裡記錄下來。

經典的父母/孩子：

 <div>
  <div> </div>
</div>

假設這個父母隱藏的溢出以及孩子使用絕對定位是很有意義的。

 .parent {
   溢出：隱藏；
   位置：相對；
}

。孩子 {
   位置：絕對； 
}

現在，假設有一個特殊情況，需要將孩子放置在父母之外，並且仍然可見。對於絕大多數情況，隱藏的溢出仍然是一個很好的默認值，因此最好將該規則放在適當的位置，但是在這種非常具體的情況下，我們需要覆蓋該規則。

 .pecial-child {
   位置：絕對； 
   底部：-20px; / *需要在父母的外部稍有稍微在父母之外 */
}

/ *不是真實的，而是為了提出點 */
.pecial-child：父母（.parent）
   溢出：可見；
}

上面的選擇器是假的，但這是“選擇.pecial-Child的父母”，這將允許根據需要覆蓋。也許就是這樣：

 .parent <p> …是在左側而不是右側選擇元素。誰知道？可能這兩個都是有問題的，最終語法將是其他的。也許我們永遠不會得到它。我不知道。只是記錄了我擁有的真實用例。</p><p>您可能會想：“為什麼不只是在父母上使用另一個特殊班級？”我會擁有的，但是父母是通過第三方圖書館通過API注入的，該API沒有提供我選擇的類別。最終，我確實必須通過編寫一些自定義JavaScript來查詢DOM以找到.pepecial-Child，找到父母，然後在此處添加類。</p><p>你們是否還有其他一些用於家長選擇器的用例？</p><p>這是Uzair Hayat的一個：</p><blockquote>
<p>我的項目具有包裹在</p>
<div>中的。 <div>有一些設計元素，一旦出現在：focus。我本可以使用:: pseudo elements之前的:: :: ::，但是輸入不支持這些元素，因為它們被替換為元素。現在，我juse javaScript檢測輸入是否為焦點並將類應用於父級。我希望我能做...<pre rel="CSS" data-line="">輸入：焦點：父（div）：{之後{
    顯示：塊;
    / *專注時顯示設計更改 */
}