先週、Internet Explorer 7の正式版がリリースになりましたね。リリースされたのは英語版のみですが、日本語版を含む各国語版も2-3週間以内にリリースされるようです。出たからには…、という事でこのサイトの表示具合も再度確認してみましたが、とりあえずは問題なさそうです。

IE7によるWebページの表示(CSS周り)はIE6と比べると大きく変わっているので、IE6との違いをきちんと認識しておかないとWebページの制作時に色々な問題が起こりそうです。というわけで、IE7についての表示とCSS対応について、他のサイトで公開されている情報を含め、個人的にまとめてみます。

まず動作モードについて。IEには標準準拠モード(Standard Mode)と互換モード(Quirks Mode)の2つがあり、モードによってCSSの解釈が異なります。IE6ではXHTML文書の先頭にXML宣言が記述されていると、本来、標準準拠モードになるはずなのに互換モードになってしまう問題がありましたが、IE7ではこの問題が解決されています。この問題に関しては、CSS実装徹底検証! そこが知りたいInternet Explorer 7という記事が詳しいです。

次に、今回から対応が追加されたCSSのプロパティについて。今回、新たに対応した主なプロパティとして、position: fixed、max-width、min-width、max-height、min-heightの5つがあげられます。各プロパティの機能はここでは取り上げませんが、簡単な使い方は次のようになります。

position: fixed;   /* 絶対位置 */
max-width: 100%;   /* 幅の最大は100% */
min-width: 50%;    /* 幅の最小は50% */
max-height: 100%;  /* 高さの最大は100% */
min-height: 50%;   /* 高さの最小は50% */

ちょっと長くなってしまったので、CSSセレクタとか、CSSハックについてに関しては、個人的まとめ その2以降に続きます。