CSS3のセレクターで属性チェックする

css

css3のセレクターで気になったものをメモる。

ただ普段jqueryを使っているせいか違和感がない。

①~から始まる場合の属性チェック

上のサンプルだとhref属性がhttpから始まるかどうかをチェックしている

~から始まるのチェックの場合は「^」を用いる。

②~で終わる場合の属性チェック

上のサンプルだとhref属性がcomで終わるかどうかをチェックしている

~で終わるのチェックの場合は「$」を用いる。

③~を含む場合の属性チェック

上のサンプルだとhref属性に特定の文字列が含まれるかどうかをチェックしている

~で終わるのチェックの場合は「*」(アスタリスク)を用いる。
アスタリスクは「全ての」という意味合いがある。