国产av日韩一区二区三区精品,成人性爱视频在线观看,国产,欧美,日韩,一区,www.成色av久久成人,2222eeee成人天堂

CSS 疑似クラス関數(shù)で複合セレクターを効果的に使用する方法を?qū)Wびます: host-context(<selector>)
P粉268284930
P粉268284930 2023-09-16 15:49:33
0
1
1134

MDN ドキュメントでは、:host-context() は次のように定義されています:

:host-context() CSS 疑似クラス関數(shù)は、CSS のシャドウ DOM を含むシャドウ ホストを選択します (そのため、そのシャドウ DOM からカスタム要素を選択できます) - ただし、関數(shù)の引數(shù)として指定された場合のみです。セレクターは、DOM 階層內(nèi)のシャドウ ホストの祖先の位置と一致する場合にのみ有効です。 言い換えれば、これにより、カスタム要素またはそのシャドウ DOM 內(nèi)のあらゆるものに、外部 DOM 內(nèi)の位置、または祖先要素に適用されたクラス/プロパティに基づいて、異なるスタイルを適用できるようになります。

問題は、提供されている実際の例では、:host-context(article,side) { color: grey; } ステートメントが機能しないことです。同様に、:host-context(h1 a){background:orange} のような他のスペース區(qū)切りの複合セレクターを追加しようとすると、同じ問題が発生します。

以下はドキュメント ページに記載されている例です:

リーリー

なぜこれが起こっているのか、またはスペース區(qū)切りのセレクター (子孫セレクターなど) を :host-context() 疑似クラス関數(shù)のパラメーターで機能させる方法を知っている人はいますか?

:host-context() 擬似クラス関數(shù)は、引數(shù)として h1 a のようなスペースで區(qū)切られた複合セレクターを受け取ることができると期待していました。そのようになっているからです。ドキュメントページに記載されています。

###ありがとう。

P粉268284930
P粉268284930

全員に返信(1)
P粉031492081

これは、MDN サンプルの無効なコードです。 <compound-selector> または <simple-selector> のみが受け入れられるタイプです。

変更を加えたので、この プル リクエスト は承認されました。


###説明する###

無効な例をドキュメントから削除しました。

ドキュメントの構(gòu)文

リーリー

無効な例

リーリー

:host-context()

疑似クラス関數(shù)に指定された引數(shù)が <compound-selector> ではないため、これは無効です。代わりに、これは「セレクター リスト」ですが、これは無効であり、実際の例では機能しません。 リーリー

:host-context()

疑似クラス関數(shù)に指定された引數(shù)が <compound-selector> ではないため、これは無効です。代わりに、これは <complex-selector> ですが、これは無効であり、実際の例では機能しません。 これについては、

「セレクターの構(gòu)造 - CSS セレクター - MDN ドキュメント」ページ

で説明されています。 ###モチベーション### 無効な CSS は、

実際の例

を見るときに混亂を引き起こす可能性があります。

いいねを押す +0
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート