勉強したことのメモ

Webエンジニア / プログラマが勉強したことのメモ。

特定のID / Classを持つタグの親要素に対してCSSを割り当てる方法

  CSS

特定のID / Classを持つタグの親要素に対してCSSを割り当てたい。また、その案件ではASPを用いたサイトのため親要素に対してインラインで直接CSSを書いたり、ID / Classを付与することはできないという制限があった。以下に対応方法のメモ。

 

リファレンス

https://developer.mozilla.org/ja/docs/Web/CSS/:has

 

ソースコード

<style>
div:has(#test){
    color: #f00;
}
</style>
<div>
    親要素
    <div id="test"></div>
</div>

 

参考サイト

https://techkoya.com/css-has/#index_id1

 - CSS

  関連記事

CSSで親子関連のセレクターをネスト(入れ子)で指定する方法
CSSで親子関連のセレクターをネスト(入れ子)で指定する方法

CSSで親子関連のセレクターを指定する場合「.parent .child{}」の ...

Bootstrapよりも簡単でClassを付与する必要のないCSSフレームワーク「Simple.css」の利用方法
Bootstrapよりも簡単でClassを付与する必要のないCSSフレームワーク「Simple.css」の利用方法

何らかのテストページを提出する際、見た目を整えるためBootstrapを使用した ...

videoタグで表示させた動画をjQuery&CSSでフローティングビデオ対応させる方法
videoタグで表示させた動画をjQuery&CSSでフローティングビデオ対応させる方法

Web上の動画をFloatingVideo対応したいという要望を受けた。ページ上 ...

CSSフレームワークであるTailwind CSSの特徴とBootstrapとの違いについて
CSSフレームワークであるTailwind CSSの特徴とBootstrapとの違いについて

あるサイトをWappalyzerで調査していた際にUIフレームワークがTailw ...

CSSで一つの要素に対して複数の背景色を指定する方法
CSSで一つの要素に対して複数の背景色を指定する方法

1つのdiv要素に対して複数の背景色をつけたかった。background-col ...