ごんたのお気楽な毎日

--年--月--日(--)

2010年05月18日(火)

XHTMLとCSS3を使って、パンダ（ジャイアントパンダ）を描いてみた。画像やJavaScriptは一切使っていない。

完成図

「主要5ブラウザの最新安定版」で表示した画面をキャプチャし、並べて縮小したもの。制作したWebページを表示すると、クリックで絵が変化したり瞬きしたりするが、これは画像だから変化しない。

CSS3を使うと、今まで画像やJavaScriptを使わないと表せなかったことが、CSSだけで可能になる。

CSS2.1では無理だったこと

• 角を丸くする。
• 背景にグラデーションをかける。
• 対象物を、回転・拡大/縮小・歪ませる。
• 文字やボックスに陰影をつける。
• アニメーションさせる。

現在CSS3は、まだW3Cの勧告に至っておらず、草案（合議して決めるために作られた案）の段階。だから、仕様は二転三転する可能性がある。

ただし、勧告されるのは当分先の事であり、勧告されていなくても使用してよい。各ブラウザは、W3Cの草案を基にCSS3を先行実装していて、Web開発者の意見を取り入れながら実装・改良をしていくようだ。

• 続きを読む »