Modernizr実行結果まとめ

それぞれの実行結果を表にまとめた結果は次のとおり(※は開発版を示す)。

Webブラウザ名 IE Firefox Opera Safari Chrome
バージョン 6 7 8 3.5 9.64 ※ 10b1 3.2.1 4.0 2.0.172.33 ※ 3.0.190.0
(Mac)
※ 3.0.190.4
canvas × × × ○ ○ ○ ○ ○ ○ ○ ○
rgba × × × ○ × ○ ○ ○ ○ ○ ○
hsla × × × ○ × ○ ○ ○ ○ ○ ○
multiplebgs × × × × × × ○ ○ ○ ○ ○
borderimage × × × ○ × × ○ ○ ○ ○ ○
borderradius × × × × × × ○ ○ ○ ○ ○
boxshadow × × × ○ × × ○ ○ ○ ○ ○
opacity × × × ○ ○ ○ ○ ○ ○ ○ ○
cssanimations × × × × × × × ○ ○ ○ ○
csscolumns × × × ○ × × ○ ○ ○ ○ ○
cssgradients × × × × × × × ○ ○ ○ ○
cssreflections × × × × × × × ○ ○ ○ ○
csstransforms × × × ○ × × ○ ○ ○ ○ ○
csstransitions × × × × × × ○ ○ ○ ○ ○


ご覧いただいたとおり、Modernizrを使用することでこのような「まとめてみた」表もあっという間に作成できるようになる。最新のWebブラウザ動向を追いかけるデベロッパには、かなりありがたいライブラリではないだろうか。

ModernizrはまだCSS3で追加となったすべてのプロパティを網羅しきっていないが、ソースをみる限りfontfaceやsvg、overflowxyといった値があることから、将来のバージョンでほかのプロパティも確認できるようになる可能性が高い。今後の発展に注目したいところだ。