CSS（SASS）で無効または読み取り専用要素のすべての子要素をスタイル化

Question

無効または読み取り専用のDOM要素のすべての子をスタイルする方法を教えていただけたらいいと思います。

私のHTMLコードは次のようになります。

<div class="wrapper" disabled="disabled"> 
    <label> 
      Test 
      <input type="text"> 
    </label> 
</div> 

と、このように私のSCSSコード：

.wrapper:disabled{ 
    *{ 
     background-color: grey; 
    } 
} 

しかし、.wrapper要素が無効になっているかどうかは問題ではありません。 .wrapperのスタースタイルが支配的です。

親divが無効になるまでこのスタイルを抑制する方法はありますか？

Answer 1

.wrapper[disabled] * { 
 
     background-color: grey; 
 
}

<div class="wrapper" disabled="disabled"> 
 
    <label> 
 
      Test 
 
      <input type="text"> 
 
    </label> 
 
</div>

CSSセレクタは