CSS 要素名[属性名~=”値”]で属性の値がどれか一つに合致する
環境
Google Chrome 109.0.5414.120
Windows 10 Home 64bit
構文
要素名[属性名~="値"]
属性の値が複数ある場合で、指定の属性の値がどれかひとつに合致する要素にCSSを適用します。
使用例
<!DOCTYPE html> <html> <head> <style> p[class~="pA"]{ color:red; } p[class~="pB"]{ color:blue; } </style> </head> <body> <p class="pA pB pC">tokyo</p> <p class="pD pW pF">oosaka</p> </body> </html>
実行結果
p[class~="pA"]に合致する要素「tokyo」の色が青になります。