none
IEでの互換表示設定とhtmlのMETAタグでのX-UA-Compatible設定の違い

    質問

  • IE9ででIE7標準のhtmlを互換表示させるためにMETAタグに以下の設定を入れています。
    <META http-equiv="X-UA-Compatible" content="IE=7" />

    ところが、ブラウザで「互換表示設定」を行うのと、上記metaタグに互換設定を入れるのとで、表示が異なる場合があります。
    具体的に把握できたのは以下になります。

    1.cssのスタイルをclass=で設定した場合に、「互換表示設定」ではclassに指定したstyleの大文字と小文字は区別していないようですが、METAタグで指定した場合には大文字と小文字を区別する
    2.styleにwidth="10"などpxなどの単位を指定しなかった場合に、「互換表示設定」では自動的にピクセルとみなされるが、METAタグで指定した場合にはサイズ設定自体が無効になる

    質問
    ブラウザでの互換表示設定とhtmlのMETAタグでX-UA-Compatible設定を行った場合の相違点をご教授いただきたいです。
    • 編集済み miyavig 2012年1月18日 6:16
    2012年1月18日 6:03

回答

  • X-UA-CompatibleにはIE=7という指定とIE=EmulateIE7とがあります。IE=7はHTML内の記述に依らずIE7相当の描画をします。それに対しIE=EmulateIE7はIE7の判断ロジックを使用してIE7相当の標準準拠モードもしくはIE5相当のクアークスモードのどちらかを選択します。

    そして互換表示ではIE=EmulateIE7相当だったかと思います(あやふや)。

    アドレスバーに javascript: alert(document.documentMode) を入力し何が表示されるかを確認してみてください。モードに応じて 5 / 7 / 8 / 9などの数値が得られることでしょう。 ドキュメント互換性の定義

    2012年1月18日 8:33
  • X-UA-Compatibleを記述しないのがベストかと思います。先に説明したようにIE5相当のモードで動作しています。これはX-UA-Compatibleが導入される以前のIE6やIE7に於いても同じです。そしてX-UA-Compatibleを記述しなかった場合のIE8以降に於いても同じです。であればX-UA-Compatibleを記述しない方がいいかと思われます。

    # もちろんそんなことよりCSSスタイルクラスを正しく大文字小文字を区別して記述しpxを省略しないなど、標準に準拠した記述をすべきですが。

    2012年1月18日 12:24

すべての返信

  • X-UA-CompatibleにはIE=7という指定とIE=EmulateIE7とがあります。IE=7はHTML内の記述に依らずIE7相当の描画をします。それに対しIE=EmulateIE7はIE7の判断ロジックを使用してIE7相当の標準準拠モードもしくはIE5相当のクアークスモードのどちらかを選択します。

    そして互換表示ではIE=EmulateIE7相当だったかと思います(あやふや)。

    アドレスバーに javascript: alert(document.documentMode) を入力し何が表示されるかを確認してみてください。モードに応じて 5 / 7 / 8 / 9などの数値が得られることでしょう。 ドキュメント互換性の定義

    2012年1月18日 8:33
  • ご返信ありがとうございます。

    javascript: alert(document.documentMode) を入力して確認してみました。

    問題が起きている画面でX-UA-CompatibleにはIE=7と指定した場合には"7"と表示され、

    X-UA-Compatibleを指定しなかった場合で互換表示設定をした場合には"5"が表示されました。

    また、X-UA-CompatibleにIE=EmulateIE7を指定した場合には"5"が表示されたことから、互換表示設定と同様の効果を得るためには"EmulateIE7"を指定するのが正しいことがわかりました。

    適切なご回答と調査方法のご連携、ありがとうございました!

    2012年1月18日 10:09
  • X-UA-Compatibleを記述しないのがベストかと思います。先に説明したようにIE5相当のモードで動作しています。これはX-UA-Compatibleが導入される以前のIE6やIE7に於いても同じです。そしてX-UA-Compatibleを記述しなかった場合のIE8以降に於いても同じです。であればX-UA-Compatibleを記述しない方がいいかと思われます。

    # もちろんそんなことよりCSSスタイルクラスを正しく大文字小文字を区別して記述しpxを省略しないなど、標準に準拠した記述をすべきですが。

    2012年1月18日 12:24
  • こんにちは。
    フォーラム オペレーターの田中夢です。
     
    佐祐理 さん
    いつも参考になるアドバイスをありがとうございます。
     
    miyavig  さん
    最後に投稿されてから少し経過しましたが、その後 佐祐理 さんの投稿をご覧になっていただけましたでしょうか?
    今回のご質問につきましては、佐祐理さんからのアドバイスを参考にしていただけたようですので、勝手ながら私のほうで [回答としてマーク] とさせていただきますね。


    また何かありましたら、MSDN / TechNet フォーラムをご利用くださいね。 
    ---------------------------------------------------------------------
    日本マイクロソフト株式会社 フォーラム オペレーター 田中夢

    2012年1月30日 2:04
    モデレータ