九州ライターの村上です、皆さんこんにちは。最近最も嬉しかったことは筋肉痛がすぐに来たことです。そんな微妙なお年ごろ。 仕事でHTML/CSSの講師をしておりますが、近年スマートフォンの普及によりCSS3.0の導入も随分と浸透してきたように思います。あわせてセレクタの書き方が複雑になってきたので、今回はCSS3.0で追加されたセレクタと擬似クラスをまとめておきます。 実務でもよく使われるものには記述例を載せていますので、参考にしてください。 CSS3で追加されたセレクタと擬似クラスまとめ 属性セレクタ 構造疑似クラス ターゲット疑似クラス UI要素状態疑似クラス 否定擬似クラス 属性セレクタ 属性で設定した値に関するセレクタです。 E[Attr^=”val”] セレクタ[属性^=”値”] Attr属性の値がvalで始まるセレクタに適用する。 【例】リンクの属性がhttpを含む(外部リンク)場
![スマホ対策に!CSS3追加セレクタと疑似クラスの書き方サンプル | 株式会社LIG(リグ)|DX支援・システム開発・Web制作](https://cdn-ak-scissors.b.st-hatena.com/image/square/6b8fb84bc23932ed3bea84b8dd28fbc1c8d9db02/height=288;version=1;width=512/https%3A%2F%2Fliginc.co.jp%2Fwp-content%2Fuploads%2F2014%2F03%2Feyecatch35.jpg)