IE9でCSS3メディアクエリを試す方法

PCブラウザからスマートフォンブラウザまで、多種多少なサイズのスクリーンに適したWebデザインを提供する方法として、CSS3で策定が進められているメディアクエリが注目されている。現在開発中のバージョンも含めると、すべての主要ブラウザがCSS3メディアクエリをサポートすることになり、今後のWebデザインにおいて欠かせない機能になるとみられている。

The CSS Corner: CSS3 Media Queries - IEBlogにおいてIE9におけるCSS3メディアクエリが紹介されている。IEはIE9 PP2からCSS3のメディアクエリをサポート。IE5のころからメディアクエリは実装していたがサポートしているメディアタイプはscreenとprintのみで、その機能も印刷向けのレイアウトを提供するという用途のために用意されていた。

IE9 PPではwidth、height、device-width、device-height、orientation、aspect-ratio、device-aspect-ratio、resolution、color、color-index、monochromをサポート。orientationを除いてmin-とmax-のプレフィックスもサポートしている。CSS3メディアクエリのテスト用に提供されているCSS3 Media Queriesを閲覧することで、IE9でもCSS3メディアクエリが動作していることを確認できる。