2018年当時と機能は変わりませんが、セレクター名が変わったものや、実装が進んだものもあります。把握しているものは記事中で修正、追記されていますが、最新仕様も併せてご確認ください。
最終回 詳細度と付き合う
最終回はCSSの持つ一見複雑な詳細度を、実際の実装の中でどのようにコントロールするか、またどんなことに気をつけているのか、筆者の体験をもとに解説します。
第8回 詳細度の計算
セレクターには詳細度というものがあります。ひとつの要素に対して複数のCSS宣言がなされた場合、詳細度を計算して、適用するCSSが定められます。この記事では詳細度について解説します。
第7回 擬似要素 2
擬似要素の実装にはちょっとした落とし穴があります。この回では、それらの注意点を取り上げて解説します。
第6回 擬似要素 1
Selectors Level 4の仕様書を元に、セレクターの総ざらいをしています。今回から擬似要素の解説に入ります。まずは、擬似要素の基本と、業務でよく使う擬似要素と、その利用方法を解説します。
第5回 擬似クラス 3
フォームやユーザーの動作に対応する擬似クラスを解説します。将来的に使えるようになるかもしれない仕様についても触れます。
第4回 擬似クラス 2
文書構造を利用しながら、特定の要素を指定する擬似クラスを解説します。Selector Level 4では引数にセレクターを渡すこともできるようになります。少し未来の仕様ものぞいてみましょう。
第3回 擬似クラス 1
セレクターに付与されるキーワードで、セレクターで選ばれた要素が特定の状態になったときを示す擬似クラスを解説します。普段、ホバーなどの擬似クラスはよく使っていると思いますが、それ以外にも多くの擬似クラスがあります。
第2回 結合子
2回目はある要素の子要素、子孫要素、兄弟要素の選択ができる結合子の解説をします。4種類ある結合子の特徴を押さえることで、目的の要素に適切なスタイルを付与できます。
第1回 基本セレクター
第1回目では、まずセレクター一般についての説明をします。次に5種類の基本セレクターについて解説します。普段の業務で使っているセレクターを今一度、基本仕様から押さえてみましょう。