Smart Communication Design Company
ホーム > ナレッジ > Blog > Web標準Blog > 2011年3月 > 基礎となりつつあるCSS3と、CSSの現在、これから

Web標準Blog

Web標準Blogでは、Web標準の利用に興味のあるWebサイト管理者、Webデザイナーの方向けに、Web標準を利用するための手法やノウハウ、参考になるリソース等を、国内外を問わずご紹介します。

2011年3月25日

基礎となりつつあるCSS3と、CSSの現在、これから

フロントエンド・エンジニア 矢倉

3月はブラウザのリリースが続いた一ヶ月でした。Internet Explorer 9, Firefox 4, Chrome 10が正式版となり、またOpera 11.10, Chrome 11がそれぞれベータ版として公開されました。

それぞれのCSSサポート状況を見ながら、CSS3の現在とこれからについて考えてみました。

スナップショットがベースラインに

IE9でがセレクタとColor, 名前空間、メディアクエリーを実装したので、デスクトップブラウザにおいてCSSスナップショットが満たされたことになります。IE9がWindows Phone 7に提供されると、スマートフォンにおいてもそれが完了します。CSS3は一部ではありますが、CSSの基礎となったのです。現在のPCサイトでは主にCSS 2.1段階のCSSが開発の基礎技術として認識されていたように思いますが、今後はスナップショットに移行していくのではないでしょうか。

また、これからはCSS3の一部もCSSの基礎として学ぶことになるのでしょう。先日CSS3のセレクタ仕様とスタイル属性の日本語訳を公開しましたので、他の日本語訳とあわせ参考にしていただけたらと思います。

他のモジュールも実装が進む

次期スナップショットに追加されるであろうモジュールにはBackgrounds & Bordersがありますが、勧告候補の段階にあり、かつ実装がある仕様は他にもあります。

Opera 11.10ベータでは、Multi-column layoutモジュールのサポートが行われました。こちらは2009年に勧告候補となっており、安定していると見られます。Operaでも今回、接頭辞なしの実装が行われています。GeckoやWebKitでは接頭辞付きの実装ですが、近々勧告候補が更新される予定ですし、勧告に向けた実装と検証が本格的にスタートするかもしれません。

草案レベルではありますが、実装が進められている機能もあります。

先月公開されたImage Valuesに追加されたばかりのグラデーション機能はGecko, WebKitが実装していますが、Opera 11.10ベータでも接頭辞つきで実装されています。Image Valuesモジュールには他にも面白い機能が追加されていますが、それらは実装も少なく仕様の安定性に関しても疑問がのこります。モジュール全体ではまだまだですが、グラデーション機能だけをとってみると、なかなかの速さで進んでいるように感じます。

また、草案のまま止まっている2D TransformsがIE9で実装されました。こちらはGecko, WebKit, Prestoで実装が行われていますから、停滞していた最終草案、勧告候補への動きが活発になるかもしれません。

CSS4へ

Firefox 4では:-moz-any()というセレクタが固有拡張として追加されました。数日前にWebKitも:-webkit-any()としてこのセレクタを実装しました。

昨年のエントリ:-moz-any()を紹介したとき、「CSS4セレクタとして同様の機能が定義されるかもしれません」と書きましたが、昨日、CSS4セレクタのEditor's Draftが登場しました。この文書では現在、:matches()という、:any()と同等の機能が定義されています。Editor's Draftは非公式なものであるため、名称や機能の変更が草案以上に起こりやすいものですが、実装が複数生まれたこともあり、今後の標準化にむけたよいスタートが切り出せたのではないでしょうか。