以前Internet Explorerの互換表示設定でハマったことを書きました。
Internet Explorer 11でplaceholderが使えなかった原因 - ソフトウェア開発者の日常
headタグ内に
<head> <meta http-equiv="X-UA-Compatible" content="IE=Edge"> </head>
と書けば、ドキュメントモードがEdgeになるのは把握しました。
今回は、
- metaタグを指定せず、互換表示設定をしていない場合
- metaタグを指定せず、互換表示設定をした場合
- metaタグを指定し、互換表示設定をした場合
の3パターンで、ブラウザの表示および開発者ツールでの表示はどのようになるのか比較してみました。
Internet Explorer 10で確認
- metaタグを指定せず、互換表示設定をしていない場合
ブラウザーモード、ドキュメントモードともに、標準と呼べる状態になっています。
アドレス欄の互換表示設定のマークはOFFになっています。
- metaタグを指定せず、互換表示設定をした場合
ドキュメントモードが[IE7 標準]になります。
DOCTYPEがコメントアウトされ、無効になっています。
アドレス欄の互換表示設定のマークがONになっていることから、互換表示されていることがわかります。
- metaタグを指定し、互換表示設定をした場合
ドキュメントモードが[標準]に戻っています。
ブラウザーモードが[IE10 互換表示]になっているのは、仕方ないんでしょうね。
アドレス欄の互換表示設定のマークが表示されなくなります。
Internet Explorer 11で確認
- metaタグを指定せず、互換表示設定をしていない場合
ドキュメントモードは[Edge(規定)]になっています。
- metaタグを指定せず、互換表示設定をした場合
ドキュメントモードが[7(規定)]になり、[ローカルの互換表示設定から]とも表示されています。
- metaタグを指定し、互換表示設定をした場合
ドキュメントモードは[Edge(規定)]になり、[X-UA-Compatible META タグから]とも表示されています。
Internet Explorer 10かInternet Explorer 11であれば状態の違いがわかるようになりました。
Internet Explorerで表示が崩れていると言われたときの確認する材料として使っていきたいです。
