CSS3とは？｜CSS3－CSS辞書｜havin' a coffee break

＃

そもそも“CSS”とは？

“CSS(カスケーディング・スタイル・シート、Cascading Style Sheets)”はHTMLなどで構造化された文書がどのように描画されるかを制御するためのスタイルシート言語です。

“カスケード(Cascade)”は本来は何段にも連なった小さな滝のことを指す言葉で、そこから派生して連鎖的、段階的に物事が生じる様子を意味します。CSSの大きな特徴は、上流で指定されたスタイルを下流へ引継ぐ“継承”が行われ、上流で指定されたスタイルと下流で指定されたスタイルが競合する場合には定められた優先順位によって適用されるスタイルが決定されることですが、この仕組みを“カスケード(Cascade)”と呼びます。

CSSはHTMLで記述されたウェブページのレイアウトやデザインを表現するために使用されることで知られますが、CSSはHTMLだけでなくXMLなども含めた他のマークアップ言語で記述された構造化文書に適用することが可能です。また、画面で表示されるいわゆる“ウェブページ”だけでなく紙などへの文書の描画についても定義しています。

＃

“スタイルシート”とは？

“スタイルシート(Style Sheet)”は構造化文書の見栄えを制御するための仕組みで、その規則を記述するためのコンピューター言語はスタイルシート言語と呼ばれます。CSS以外にもスタイルシート言語は存在しますが、ウェブ上で広く使用されているスタイルシート言語はCSSのみであるため、単に“スタイルシート”と言う場合は通常はCSSで記述されたスタイルシートのことを指します。

過去にはHTMLでも書体や文字の色を変える“font”要素や太字にする“b”要素、イタリック体にする“i”要素などの見栄えを整える要素や属性が存在したことがありますが、これは文書の構造を記述するための言語であるHTMLの本来あるべき姿から逸脱しており、HTML5以降の仕様では見栄えのための機能はHTMLでは廃止され、スタイルシート言語であるCSSがその機能を担うことになりました。

＃

“CSS3”とは？

“CSS3”は一般にCSSの最新の仕様を指して使用される言葉です。一般的に“CSS3”と呼ばれる仕様はそれ以前の“CSS2.1”までとは異なり、“Cascading Style Sheets, Level 3”という単一の仕様書としては存在しません。“CSS3”は“CSS2.1”の仕様書を核とし、これに機能を拡張・追加したり、一部の定義を置き換えたりする多数の“モジュール(Module)”と呼ばれる仕様書から構成され、機能ごとに仕様書が細分化されています。

CSSの仕様はW3CのCSSワーキング・グループ(CSSWG)により策定されており、“CSS3”を構成するモジュールもW3Cによって策定が進められています。

“CSS3”を構成する仕様書の多くはまだ策定中で仕様が完全に固まっていません。策定中の仕様であっても主要なブラウザの対応が進んでいて多くのウェブサイトで使用されているものも多くありますが、その一方でブラウザによる対応が進んでいない機能も数多くあります。

“CSS3”という一つの仕様はありませんが、数年に一度“CSS Snapshot”と呼ばれるその段階でのCSSの使用の策定状況を記載したスナップショットがW3Cによって発行され、どの仕様が固まっていて、どの仕様がまだ策定段階なのかが示されています。

＃

“CSS3”とこれまでの仕様の違い

“CSS3”にはグリッド・レイアウトやフレキシブル・ボックス・レイアウトといった新しいレイアウト方法やアニメーションなど、過去のCSSでは表現することができなかった多様な表現が可能となり、大幅に機能が増えました。

しかし、“CSS3”は過去のCSSの仕様を土台として策定されているため、基本的にすべての機能に後方互換性があり、“CSS3”になることによってコードを書き換えたりする必要はありません。

＃

CSSの“レベル”

CSSの仕様書の改訂版は一般的な“バージョン”ではなく、“レベル(Level)”の番号が付けられます。新しいレベルのCSSは前のレベルのCSSの仕様を土台にして策定され、定義済みの機能をより洗練されたものにしながら新しい機能が追加されます。これにより新しいレベルのCSSは過去のレベルのCSSの仕様にあるすべての機能を含むことになり、新しいレベルのCSSに対応したユーザー・エージェントは過去のレベルのCSSにも対応することになります。

“CSS Level 1”

最初のCSSの仕様書は1996年12月17日に勧告された“Cascading Style Sheets, level 1”です。この仕様書は一般的に“CSS1”と呼ばれ、フォントや背景、パディング、ボーダー、マージンを指定するプロパティなどの基本的な機能が定義されました。

“CSS Level 2”

次のCSSの仕様書は1998年5月12日に勧告された“Cascading Style Sheets, Level 2”です。この仕様書は一般的に“CSS2”と呼ばれ、“CSS1”から大幅に機能が増えました。

“CSS2”が勧告された当時はまだ“勧告候補”の段階がなく、“作業草稿”から直接“勧告”となったこともあり、“CSS2”は実装されてから多くの問題点が明らかになりました。そのため、問題を解消した“Cascading Style Sheets, Level 2 Revision 1”が2011年6月7日に勧告されました。この仕様書は一般的に“CSS2.1”と呼ばれます。

“CSS2.1”の仕様の策定の過程では“CSS2”の機能のうちブラウザによる実装が進んでいなかった機能の多くは仕様から取り除かれましたが、それらの機能は“勧告候補”の段階にあるものとして扱われ、“CSS3”で再定義されることになりました。

“CSS Level 3”

“CSS3”も“Cascading Style Sheets, Level 3”という呼び方をされることがあります。しかし、これは過去のレベルとの区別のための呼び方であり、前述した通り“Cascading Style Sheets, Level 3”という名前の単一の仕様書は存在しません。よってCSS全体では“CSS Level 3”以降の“レベル”はありません。

ただし、“CSS3”を構成するモジュールには“CSS Cascading and Inheritance Level 3”や“CSS Text Module Level 3”というようにそれぞれに“レベル”があります。それぞれのモジュールは“Level 3”の後も“Level 4”や“Level 5”へ到達することはありますが、CSS全体の仕様としての“Cascading Style Sheets, Level 4”や“Cascading Style Sheets, Level 5”はなく、“CSS4”や“CSS5”という呼び方も一般的ではありません。

なお、“CSS2.1”から定義されている機能を拡張するモジュールは“Level 3”からモジュールが策定されていますが、“CSS Animations Level 1”や“CSS Transforms Module Level 1”などの“CSS2.1”にはなかった新しい機能を定義しているモジュールは“Level 1”から番号付けされています。なので、いわゆる“CSS3”には“Level 1”のモジュールも多数含まれます。