[CSS]クラス名での絞り込み[セレクタ][memo]

　属性名での絞り込みを使ったクラス名によるセレクタ絞り込みのメモ。

属性名での絞り込み

[属性名^=”forward”] /* 前方参照 */

[属性名$=”backward”] /* 後方参照 */

[属性名=”all”] /* 全体一致 */

[属性名*=”part”] /* 部分一致 */

※ただし、forward, backward, all, partはそれぞれ一致させたいキーワードを指すものとする

　詳しい条件までは使えないが、正規表現的なものが使える。

クラス名での絞り込み

クラス名で絞り込みたい場合、属性名をclassに変えて、

[class^=”keyword”]

などとする。

注意点

　なお、これはあくまで属性名での絞り込みのため、前方参照と部分一致の指定では結果が違うなどといったことがある。
例えば、

<div class=”keyword1 keyword2″></div>

の場合、keyword2を前方一致の形式で指定すると指定が適用されないが、部分一致の指定では適用される。