https://takao.blog/ja/tags/selector/Recent content in Selector on たかおの解説Hugo -- gohugo.iojaたかおの解説Sat, 13 Jun 2026 23:11:50 +0900https://takao.blog/ja/web/css-has-pseudo-selector-recipes/Tue, 10 Mar 2026 00:00:00 +0900https://takao.blog/ja/web/css-has-pseudo-selector-recipes/<img src="https://takao.blog/img/thumnail.webp" alt="Featured image of post CSS親セレクタ :has() の超便利マークアップレシピ集" /><h2 id="css親セレクタ-has-の超便利マークアップレシピ集">CSS親セレクタ <code>:has()</code> の超便利マークアップレシピ集 </h2><p>長年、CSS開発者は<strong>親セレクタ</strong> — 子要素に基づいて親要素をスタイリングする方法 — を夢見てきました。JavaScriptや余分なクラス名が唯一の回避策でした。そこに登場したのが<code>:has()</code>疑似クラスです。「この要素がXを含んでいたら、そのようにスタイルを変える」という処理をネイティブCSSで実現します。</p>