エントリーの編集
![loading...](https://b.st-hatena.com/bdefb8944296a0957e54cebcfefc25c4dcff9f5f/images/v4/public/common/loading@2x.gif)
エントリーの編集は全ユーザーに共通の機能です。
必ずガイドラインを一読の上ご利用ください。
「ある要素を含む場合」のスタイル指定がcssだけでできる!:has() を使う方法[css, :has()]
記事へのコメント0件
- 注目コメント
- 新着コメント
このエントリーにコメントしてみましょう。
注目コメント算出アルゴリズムの一部にLINEヤフー株式会社の「建設的コメント順位付けモデルAPI」を使用しています
![アプリのスクリーンショット](https://b.st-hatena.com/bdefb8944296a0957e54cebcfefc25c4dcff9f5f/images/v4/public/entry/app-screenshot.png)
- バナー広告なし
- ミュート機能あり
- ダークモード搭載
関連記事
「ある要素を含む場合」のスタイル指定がcssだけでできる!:has() を使う方法[css, :has()]
Top > Web一般 > 「ある要素を含む場合」のスタイル指定がcssだけでできる!:has() を使う方法[css, :ha... Top > Web一般 > 「ある要素を含む場合」のスタイル指定がcssだけでできる!:has() を使う方法[css, :has()] 今回はタイトルの通り、cssだけで 「ある要素を含む場合」を特定して、その要素を含む親要素にスタイル指定をする方法になります。 具体的には、 :has() という擬似クラスを使用します。 こちらの :has() 、昨年2022年の中頃までは対応ブラウザが少なく 便利なことはわかっているものの、実務での投入は二の足を踏む存在だったのですが 2023年3月現在、FireFoxを除く主要ブラウザのほぼ全てで対応されており、 実務での使用がかなり現実的なものとなってきました。 当記事の後半では、FireFox等、未対応ブラウザの場合の対処法についても記載していますので、 あわせてご覧ください。 それでは早速、:has() を使ったスタイル指定の方法について、次の