【CSS】セレクタを正規表現で指定

この記事では、CSSのセレクタを正規表現で行う方法とサンプル例をまとめました。

セレクタの正規表現

CSSのセレクタは、正規表現で行うこともできます。
これにより効率の良い記述ができます。

書式 セレクタ 記述例 説明
属性 [属性名] div[class] class属性をもつ全てのdivタグを指定
属性値 [属性名=”属性値”] 指定した属性値をもつ要素全て(完全一致) div[type=”box”]|class属性値「box」をもつ全てのdivタグを指定
属性値(先頭一致) [属性名^=”属性値の文頭”] div[class^=”b”] class属性値「b」を文頭にもつ全てのdivタグを指定
属性値(末尾一致) [属性名$=”属性値の末尾”] div[class$=”x”] class属性値「x」を末尾にもつ全てのdivタグを指定
属性値(部分一致) [属性名*=”属性値の一部”] div[class*=”o”] class属性値「o」を一部にもつ全てのdivタグを指定
関連記事
1 【HTML/CSS入門】Web制作のサンプル集
2 【Javascript入門】サンプル集

コメント