CSS3 とは、Cascading Style Sheets 言語の最新の発展版で、CSS2.1 の拡張を目指しています。CSS3 は、丸角やシャドウ、グラデーション、トランジション、アニメーション、同様に、マルチカラム、フレクシブルボックス、グリッドレイアウトのような新しいレイアウトのような多くの待望の新規の機能をもたらします。 実験的な部分はベンダープレフィックスが必要であり、将来的に構文と意味の両方が変更される可能性があるため、本番環境では避けるか、細心の注意を払って使用すべきです。
モジュールと標準化プロセス
CSS レベル 2 は、勧告に至るまで、2002 年 8 月から 2011 年の 6 月までの 9 年間が必要でした。これは、いくつかの 2 次的な機能が仕様全体を堰き止めたためです。問題のない仕様の標準化を加速させるために、W3C の CSS Working Group は、北京ドクトリンと呼ばれる決定に従い、CSS をモジュールと呼ばれる小さなコンポーネントに分割しました。現在、それぞれのモジュールは言語の独立したパートで、それぞれのペースで標準化に向かっています。いくつかのモジュールが既に W3C に勧告されている一方で、まだ早期の Working Draft のモジュールもあります。また、必要が認められた時は、新しいモジュールも追加されています。
正式には、CSS3 標準自体は存在しません。 それぞれのモジュールは独立して標準化されています。標準の CSS は、完了したモジュールによって改正および拡張された CSS2.1 で成り立っており、すべてに同じレベルの番号は必要ありません。各時点での、CSS 標準のスナップショットは、CSS2.1 と成熟したモジュールをリストすることで定義できます。
W3 コンソーシアムは、2007 や 2010 のように、定期的にそのようなスナップショットを公開しています。
現在のところ、レベル 3 以上のモジュールは標準化されていませんが、将来的には変更されます。Selectors 4 や CSS Borders、Backgrounds Level 4 のようないくつかのモジュールは、既に Editor's Draft がありますが、最初の Working Draft を公開する状態には至っていません。
CSS モジュールの状態
安定版モジュール
いくつかの CSS モジュールは、既にかなり安定しており、CSSWG の勧告レベル 3 つのうち、いずれかに到達しています: 勧告候補、勧告案、勧告。いくつかの機能は勧告候補段階で削除される可能性がありますが、接頭辞なしで使用でき、かなり安定しています。
これらのモジュールは、仕様の中心を構成する CSS2.1 仕様を拡張および修正します。これらはまとめて、CSS 仕様の現在のスナップショットです。
Selectors 仕様の次のイテレーション はすでに進行していますが、まだ初めの Working Draft を公開する段階には至っていません。
Media Queries |
勧告 since June 19th, 2012 |
元のメディアタイプ(print 、 screen 、 … )を、only screen and (color) のような デバイスメディア特性のクエリ を使用できる言語に拡張しました。
メディアクエリは、CSS ドキュメントで使用されるだけではなく、<link> 要素のmedia 属性のように、いくつかの HTML 要素の属性でも使用されています。
|
ホバーやポインターのような新しいメディア機能で、ユーザーエージェント上で Web サイトの入力方法をカスタマイズできる この仕様の次のイテレーション が行われています。script
メディア機能を使用した EcmaScript サポートの検出機能も提案されています。
Background と Border 仕様の CSS4 イテレーション は既に進行していますが、まだ初めの Working Draft を公開する段階には至っていません。この仕様では、border をクリックする機能(CSS border-clip
と border-clip-top
、border-clip-right
、border-clip-bottom
、border-clip-left
プロパティ)や、コーナーの border の形のコントロール(CSS border-corner-shape
プロパティの使用)を追加する予定です。
CSS Speech Module |
勧告候補 |
speech メディアタイプや聴覚フォーマットモデル、スピーチレンダリングユーザーエージェントのための多くのプロパティの定義。 |
CSS Image Level 3 を置き換えるであろう CSS Image Values and Replaced Content Level 4 は開発中で、草案 です。
<ident>
と <custom-ident> のようないくつかの型定義は、
CSS Values and Units Module Level 4 に延期されています。
CSS Text Decoration Level 3 |
勧告候補 |
拡張:
追加:
明確化:
リスク: ブラウザ実装が不十分なため、text-decoration-skip と行ポジジョンルール、同じテキスト上に強調記号とルビを配置する機能は、このモジュールの次のイテレーションに延期されるかもしれません。
|
CSS Shapes Module Level 1 |
勧告候補 |
フロートに適用することができる geometric shapes が定義されました。これらの shapes は、バウンディングボックスがラップする代わりに、インラインコンテンツが周囲をラップする領域を提供します。 |
CSS Masking Level 1 |
勧告候補 |
ビジュアル要素の部分を一部、または完全に隠すための方法が定義されました。これはほかのグラフィカル要素、または画像を輝度またはアルファマスクとして使用する方法を提供します。 |
リファインフェーズのモジュール
リファインフェーズ であるとみなされている仕様は、既にかなり安定しています。まだ変更が想定されますが、現在の実装からの非互換性を作らないべきです;それらは、周辺的な動作を定義すべきです。
CSS Transforms Level 1 |
草案 |
追加:
transform と transform-origin プロパティを使用していずれかの要素に適用される 2 次元変形のサポート。サポートされる変形: matrix () と translate() 、translateX()、 translateY() 、scale()、 scaleX() 、scaleY()、 rotate()、 skewX()、 skewY() 。
- the support of tri-dimensional transforms to be applied to any element by adding the CSS
transform-style と perspective 、perspective-origin 、backface-visibility プロパティの追加、および transform プロパティの次の変更による拡張: matrix 3d() と translate3d() 、translateZ() 、scale3d() 、scaleZ()、 rotate3d()、 rotateX ()、 rotateY ()、 rotateZ()、 perspective() によっていずれかの要素に適用される 2 次元変形のサポート。
ノート: この仕様は CSS 2D-Transforms と CSS 3D-Transforms、SVG transforms のマージです。
|
初期の CSS Text Level 3 draft のいくつかの機能は、このモジュールの次のイテレーションに延期されました。
修正フェーズのモジュール
修正フェーズのモジュールは、リファインフェーズのものよりも安定度が欠けます。一般的に、構文は検査下にあり、非互換的な方法で多くの改善が行わるかもしれません。代替えの構文はテストされて、一般的に実装されています。
CSS Basic User Interface Module の次のイテレーションに追加されるもの初期リストが 利用可能 です。
探求フェースのモジュール
CSS Image Values and Replaced Content Module Level 4 |
草案 |
拡張:
- 双方向感応イメージを許可する画像の方向
(rtl か ltr )を提供する image() 関数表記。
image-orientation プロパティに、画像に保存されている EXIF データへの追従を考慮できる from-image の追加。
追加:
- 画像の解像度ネゴシエーション選択を可能にして、異なる解像度で同等の画像の定義を許可する
image-set() 関数表記。
- 画像のようにページの一部を使用できる
element() 関数表記。
- 2 つの画像間を遷移して、それらの間に挿入を定義するとき、中間画像を参照できる
cross-fade() 関数表記。
- グラデーションの新しいタイプを表現する
conic-gradient() と repeating-conic-gradient() 関数表記。
- オブジェクトのサイズ変更をどのように行うか定義する
image-rendering プロパティ。
|
リライティングフェーズのモジュール
リライティングフェーズのモジュールは、旧くなっており、書き換えが求められています。構文は精査中で、非互換性を含む多くの変更が加えられています。代替えの構文はテストされ、多くの場合実装されています。