しゅう【Webサイト制作/改良・コーダー】のPortfolio Site

子要素にホバーしたら、親要素のスタイルを変えるCSSセレクター「.親要素クラス名:has(.子要素クラス名:hover)」

当サイトはアフィリエイト広告を利用しています

これはシンプルなので、自分の投稿と、引用投稿張っておきます↓↓

著作権？とかも微妙なので、コードのコピペはやめときます。

これは使える…
有益情報ありがとうございます〜 https://t.co/oqiEt3ZJNX
— しゅう【Webサイト制作/改良・コーダー】_筋トレとプログラミング学習で一生成長期のおやじ (@shu_web_net) April 23, 2025

↓↓引用元のX投稿

/* 子要素がホバーされたら、親の背景を変える */
.card:has(.card-content:hover) {
background-color: #f5f5f5;
}

特定の子要素の時、親要素のスタイルを変えられる、hasの使い方を学んだ！
chatGPTは最新の技術も教えてくれるから取り入れていきたいですね。
— TKG【WEB制作】 (@TKG1494863) April 23, 2025

前の記事へ記事一覧

Xフォローも大歓迎です
XのDMからもお問い合わせいただけます↓↓
Xではブログで記事にしているような
Web制作系の小ネタを日々投稿しています

X【Twitter】

しゅう【Webサイト制作/改良
・コーダー】
のPortfolio Site

子要素にホバーしたら、親要素のスタイルを変えるCSSセレクター「.親要素クラス名:has(.子要素クラス名:hover)」

公式Lineのトークからも
ご相談・お問い合わせいただけます↓↓
無理な営業は一切行いません

子要素にホバーしたら、親要素のスタイルを変えるCSSセレクター「.親要素クラス名:has(.子要素クラス名:hover)」

公式Lineのトークからもご相談・お問い合わせいただけます↓↓無理な営業は一切行いません

公式Lineのトークからも
ご相談・お問い合わせいただけます↓↓
無理な営業は一切行いません