[IE] Internet Explorer 8 ドキュメント互換性モードの指定について

IE6のドキュメントタイプで表示が変わる互換性モードに頭を抱えたWeb業界の人は多かろうと思いますが、IE8で更に上位版が出たそうです。
でもIE6で悪行を働いた標準・互換モードの変更動作とは違い、IE8で導入されたドキュメント互換性は、
IEがページを表示する際に使用する特定のレンダリングモードの選択を可能にするもので、従来のDOCTYPEの変わりに
新しくMETA要素の X-UA-Compatible　により操作が可能に。

簡単にまとめると

IE8だと表示が崩れる…IE7なら崩れないのに…orz
▼
METAタグでIE7モードで表示するよう指示
▼
IE8がその指示に従ってIE7っぽくレンダリング
▼
ｳﾏｰ(ﾟдﾟ)

ということらしい。

その場合のMETAタグは次のようになる（Emulate IE7 互換性モードを指定）

<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" />

このメタタグはヘッダーの一番上（titleや他のmetaよりも上）に置かなければならない。

その他のcontent 属性値

• IE=EmulateIE5　→　Internet Explorer 5 の動作を模倣
• IE=edge　→　使用できる最高のモードを使用
• IE=EmulateIE8も使用可能

<meta http-equiv="X-UA-Compatible" content="IE=4">   <!-- IE5 mode -->
<meta http-equiv="X-UA-Compatible" content="IE=7.5"> <!-- IE7 mode -->
<meta http-equiv="X-UA-Compatible" content="IE=100"> <!-- IE8 mode -->
<meta http-equiv="X-UA-Compatible" content="IE=a">   <!-- IE5 mode --> 

各モードをセミコロンで区切って複数のドキュメント モードを指定することも可能らしい。
特定の互換性モードを除外する使い方も可能だが、推奨はされていない。

例：IE7 モードを除外

<meta http-equiv="X-UA-Compatible" content="IE=5; IE=8" />

一見便利そうだけど…用途がわからん……

※公式ドキュメントはこちら

でもやっぱりメインで確認するのはIE6なんだろうな、っていう。

ドキュメント互換性モードの判別

IE8のアドレスバーに以下を入力

javascript:alert(document.documentMode);

IE8モードをサポートしている場合、返り値は8になる。

compatMode プロパティとdocumentMode プロパティを併用した
ドキュメントの互換性モードを判別するサンプルソース（公式より）

engine = null;
if (window.navigator.appName == "Microsoft Internet Explorer")
{
// This is an IE browser.What mode is the engine in?
if (document.documentMode) // IE8
engine = document.documentMode;
else // IE 5-7
   {
engine = 5; // Assume quirks mode unless proven otherwise
if (document.compatMode)
      {
if (document.compatMode == "CSS1Compat")
engine = 7; // standards mode
      }
   }
// the engine variable now contains the document compatibility mode.
}