<!-[if!IE]>が機能しない


139

うまくいかない

<!--[if !IE]>

仕事に。これが私のドキュメントにあるためか

<!doctype html>
<!--[if lt IE 7]> <html class="ie6 oldie"> <![endif]-->
<!--[if IE 7]>    <html class="ie7 oldie"> <![endif]-->
<!--[if IE 8]>    <html class="ie8 oldie"> <![endif]-->
<!--[if gt IE 8]><!-->
<html class="">
<!--<![endif]-->

追加したとき

<!--[if !IE]><!-->
<link type="text/css" rel="stylesheet" href="/stylesheets/no-ie.css" />
<!--<![endif]-->

何らかの理由で私のヘッダーにそれが機能しません。ただし、追加した場合

<!--[if !IE]><!-->
    <style>
        All my css in here
    </style>
    <!--<![endif]-->

実際のhtmlページ(ヘッダー内)に機能します。助言がありますか?乾杯

私の質問を更新

OK、私が削除したとき、 <!-->動作していたIEのみをチェックインしましたが、FFに戻ったので、no-ie.cssがFFにも適用されていました。だから私はに戻っ<!-->て/を削除し(そしてそれをメインテンプレートに追加して、cmsがそれを元に戻さないようにします)、すべてFFで動作していますが、スタイルシートがIEに適用されています!だから私は試した

<!--[if IE]>
<link type="text/css" rel="stylesheet" href="https://stackoverflow.com/stylesheets/no-ie.css">
<![endif]-->

そして

<!--[if !IE]> -->
<link type="text/css" rel="stylesheet" href="/stylesheets/no-ie.css">
<!-- <![endif]-->

そして、それはうまくいきませんでした。基本的に私はこのページをhttp://css-tricks.com/examples/ResponsiveTables/sensitive.phpで動作させるようにしていますが、CSSをスタイルシートに移動しています。確かにそれは単純でなければならない。何が欠けていますか?必要がない場合は、jQueryを使用しません。乾杯


1
次の<!-->直後は必要ありません<!--[if !IE]>
techfoobar

29
注:IEがIE9までしか機能しない場合。
cameronjonesweb 2014年

一部の人々はいくつかのページに面白いIF IEメッセージを残しました。
neverMind9

@cameronjonesweb参照をリンクできますか?そうでない場合、これらのようなステートメントはそれほど役に立ちませんか?
-trainoasis

@trainoasis、可能ですが、私のコメントが5歳の
cameronjonesweb

回答:


236
<!--[if !IE]><!--><script src="zepto.min.js"></script><!--<![endif]-->
<!--[if IE]><script src="jquery-1.7.2.min.js"></script><![endif]-->

注:これらの条件付きコメントは 、IE 10以降ではサポートされなくなりました


39
2013年6月現在、これがこのページでの唯一の正解です。
JohnB 2013年

2
この行には終了山かっこがありませんか?そうでない場合:<!-[if!IE]> <!-> <script src = "zepto.min.js"> </ script> <!-> <![endif]->
n00shie

1
これは、他のすべての条件付きコメントソリューションと一緒に、IE 10 / IE 11を検出しません
ロイドバンク

9
IE 11では機能しません。条件が!IEの場合でもスクリプトが読み込まれます
Giedrius

49
@Giedrius IE10以降、条件付きコメントはサポートさなくなりましたmsdn.microsoft.com/en-us/library/ie/hh801214
v

70

IE以外のブラウザは、コメント文で囲まれているため、条件文をコメントとして扱います。

<!--[if IE]>
Non-IE browsers ignore this
<![endif]-->

ただし、IE以外のブラウザをターゲットにしている場合は、コードの前後に2つのコメントを使用する必要があります。IEはそれらの間のコードを無視しますが、他のブラウザはそれを通常のコードとして扱います。したがって、IE以外のブラウザを対象とする構文は次のとおりです。

<!--[if !IE]-->
IE ignores this
<!--[endif]-->

注:これらの条件付きコメントは、IE 10以降ではサポートされなくなりました


1
それは素晴らしいことです。それをありがとう。スタイルシートは機能しますが、私が今持っている問題は、ヘッダーの上のページの上部で、これが<!-[if!IE]-> <!-[endif]->(タグが本文ではなくヘッダー領域))
user1516788

21
-1:この答えは正しくないので<!--[if !IE]-->IE ignores this<!--[endif]-->されていない IEから隠さ!(7、8、または9)
JohnB 2013年

3
IE10の最近のリリースで何かが変わった(IE9モードでも試した)ので、答えはどれもうまくいきませんでした。-すべての試行が、すべてのブラウザ(IEではなくIE)の!IEセクションに到達しました。
ダニーVarod 2013

2
IE10は条件付きステートメントをサポートしていません。
蠍座

1
で空白に注意してください。<! - [IEの場合]>と<[endifの] - !> - !そこの間の任意の空白(たとえば、すべきではない-と[それは空白で仕事をしません。。
ロバートスカルチッキ

37

誰かがまだこのページに到達した場合の更新。IEターゲティングが機能しない理由を疑問に思います。IE 10以降では、条件付きコメントはサポートされなくなりました。MS公式ウェブサイトから:

相互運用性とHTML5への準拠を向上させるため、Internet Explorer 10の標準モードと互換モードでの条件付きコメントのサポートが削除されました。

詳細については、こちらをご覧ください:http : //msdn.microsoft.com/en-us/library/ie/hh801214(v=vs.85).aspx

ieを必死にターゲットにする必要がある場合、このjqueryコードを使用してieクラスを追加し、cssで.ieクラスを使用してieブラウザをターゲットにすることができます。

if ($.browser.msie) {
 $("html").addClass("ie");
}

更新:$ .browserはjQuery 1.9以降では使用できません。1.9を超えるjQueryにアップグレードするか、すでに使用している場合は、jQueryの後にjQuery移行スクリプトを含めて、不足している部分を追加することができます 。jQuery Migrate Plugin

または、このスレッドで回避策を確認してください。jQuery1.9.1への更新後のbrowser.msieエラー


それは本当に素晴らしい解決策です!特定のクラスを適用するためにdomツリーでそれを使用する必要さえありません。
mmm 2015

2
、これはjQueryの1.3から非推奨と1.9で削除されますのでご注意ください
Jøran

13

私はそれを使用し、それは動作します:

<!--[if !IE]><!--> if it is not IE <!--<![endif]-->

その結果、Firefoxではコンテンツ全体がコメントとして扱われます。@Charmanderソリューションは、IEとFirefoxの両方で機能しました-<![if!IE]> <![endif]>
Tom Chamberlain

3
注:これらの条件付きコメントはIE 10以降ではサポートされ
Flimm

12

ダウンレベルで明らかにされた条件付きの「コメント」にマイクロソフトが推奨する構文は次のとおりです。

<![if !IE]>
<link type="text/css" rel="stylesheet" href="/stylesheets/no-ie.css" />
<![endif]>

これらはコメントではありませんが、適切に機能します。


この回答をサポートするこのリンクを見つけました。スレッドに役立つ他の情報もたくさんあります。これは重要なテーマだと思います...唯一の違いは、非表示または公開された構文が使用されているかどうかであり、これがどのようになっているかわかりません他のブラウザに影響します... msdn.microsoft.com/en-us/library/ms537512.ASPX
user1360809

2
注:これらの条件付きコメントは、IE 10以降ではサポートされ
Flimm

8

まず、正しい構文は次のとおりです。

<!--[if IE 6]>
<link type="text/css" rel="stylesheet" href="https://stackoverflow.com/stylesheets/ie6.css" />
<![endif]-->

この投稿を試してください:http : //www.quirksmode.org/css/condcom.html および http://css-tricks.com/how-to-create-an-ie-only-stylesheet/

あなたができる別のこと:

jQueryでブラウザを確認します。

if($.browser.msie){ // do something... }

この場合、一部の要素のCSSルールを変更するか、新しいCSSリンク参照を追加できます。

これを読んでください:http : //rickardnilsson.net/post/2008/08/02/Applying-stylesheets-dynamically-with-jQuery.aspx


より正確な回答については、上記のuser1324409の回答を参照してください。
Chris Peters 2013年

2
jQueryの更新により、$。browser.msieを使用する人は誰でもjquery-migrate.jsをインクルードする必要があり、これが機能します。
AspiringCanadian

1
注:これらの条件付きコメントは、IE 10以降ではサポートされ
Flimm

回答で提供されたリンクは無効です。
Pankaj

8

<!-- [if !IE] --> メディアクエリでIE8がひどいので、My full cssブロックのスペースを配置する必要があります。

<!-- IE 8 or below -->   
<!--[if lt IE 9]>
<link rel="stylesheet" type="text/css"  href="https://stackoverflow.com/Resources/css/master1300.css" />        
<![endif]-->
<!-- IE 9 or above -->
<!--[if gte IE 9]>
<link rel="stylesheet" type="text/css" media="(max-width: 100000px) and (min-width:481px)"
    href="https://stackoverflow.com/Resources/css/master1300.css" />
<link rel="stylesheet" type="text/css" media="(max-width: 480px)"
    href="https://stackoverflow.com/Resources/css/master480.css" />        
<![endif]-->
<!-- Not IE -->
<!-- [if !IE] -->
<link rel="stylesheet" type="text/css" media="(max-width: 100000px) and (min-width:481px)"
    href="/Resources/css/master1300.css" />
<link rel="stylesheet" type="text/css" media="(max-width: 480px)"
    href="/Resources/css/master480.css" />
<!-- [endif] -->

コメントありがとうございます。ただし、<!-[if!IE]-> <link rel = "stylesheet" type = "text / css" href = "/ stylesheets / no-ie.csss" /> <! -[endif]->他のブラウザもこれを適用します。
user1516788 2013年

3
他のブラウザにそのセクションを適用させることがポイントではありませんか?
John Hayford

1
-1:!IEここで説明する手法は、IE 7から10のコメントブロックを実際に実行します
Ian Campbell

1
注:これらの条件付きコメントは、IE 10以降ではサポートされ
Flimm

8

IEユーザーを対象とする場合:

<!--[if IE]>
Place Content here for Users of Internet Explorer.
<![endif]-->

他のすべてをターゲットにする場合:

<![if !IE]>
Place Content here for Users of all other Browsers.
<![endif]>

条件付きコメントはInternet Explorerでのみ検出でき、他のすべてのブラウザーは通常のコメントとしてスレッド化します。

IE 6,7などをターゲットにするには、Ifステートメントで「等しい」または「より小さい(等しい)」を使用する必要があります。このような。

より大きいか等しい:

<!--[if gte IE 7]>
Place Content here for Users of Internet Explorer 7 or above.
<![endif]-->

より小さい:

<!--[if lt IE 6]>
Place Content here for Users of Internet Explorer 5 or lower.
<![endif]-->

出典:mediacollege.com


2
注:これらの条件付きコメントは、IE 10以降ではサポートされ
Flimm

7

これはIE9までです

<!--[if IE ]>
<style> .someclass{
    text-align: center;
    background: #00ADEF;
    color: #fff;
    visibility:hidden;  // in case of hiding
       }
#someotherclass{
    display: block !important;
    visibility:visible; // in case of visible

}
</style>

これはIE9以降用です

  @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {enter your CSS here}

5

IEブラウザの場合:

<!--[if IE]>
<meta http-equiv="Content-Type" content="text/html; charset=Unicode">
<![endif]-->

IE以外のすべてのブラウザ:

<![if !IE]>
<meta http-equiv="Content-Type" content="text/html; charset=utf8">
<![endif]>

8を超えるすべてのIEまたはすべてのIE以外のブラウザー:

<!--[if (gt IE 8)|!(IE)]><!--><script src="/_JS/library/jquery-2.1.1.min.js"></script><!--<![endif]-->

3

条件付きコメントは次で始まるコメントです <!--[if IE]> IE以外のどのブラウザーでも読み取ることができない。

2011から条件付きコメントはサポートされません https://msdn.microsoft.com/en-us/library/hh801214(v=vs.85).aspx

条件付きコメントを使用する唯一のオプションは、条件付きコメントをサポートするIE 9としてサイトを実行するようにIEに要求することです。

つまり、独自のcssファイルまたはjsファイル、あるいはその両方を記述して、他のブラウザがそれをロードしたり実行したりすることはありません。

このコードスニペットは、IE互換性の問題を解決するためのカスタムコードを含むie-only.cssおよびie-only.jsをIE 10または11で実行する方法を示しています。

    <html>
      <meta http-equiv="X-UA-Compatible" content="IE=EmulateIE9">
      <!--[if IE]>
            <meta http-equiv="Content-Type" content="text/html; charset=Unicode">
            <link rel="stylesheet" type="text/css" href='/css/ie-only.css' />
            <script src="/js/ie-only.js"></script>
      <![endif]-->
    </html>

1

IE 10以降を使用している場合、http://tanalin.com/en/articles/ie-version-js/で説明されているように、条件付きコメントはサポートされなくなりました。別の方法としてhttps://gist.github.com/jasongaylord/5733469を参照することもできます。これは、Tridentバージョンもnavigator.userAgentからチェックされます。これは、ブラウザが互換モードで動作している場合にも確認されました。


1

これは、バージョン6以降のすべてのブラウザー(IE7、8、9、10など、現在のChrome 3、および現在のFF ver 3)で機能します。

//test if running in IE or not
        function isIE () {
            var myNav = navigator.userAgent.toLowerCase();
            return (myNav.indexOf('msie') != -1 || myNav.indexOf('trident') != -1) ? true : false;
        }

0

このJavaScriptを使用してIEブラウザーを検出しています

if (
    navigator.appVersion.toUpperCase().indexOf("MSIE") != -1 ||
    navigator.appVersion.toUpperCase().indexOf("TRIDENT") != -1 ||
    navigator.appVersion.toUpperCase().indexOf("EDGE") != -1
)
{
    $("#ie-warning").css("display", "block");
}

0

Fernando68に感謝します、私はこれを使いました:

function isIE () {
     var myNav = navigator.userAgent.toLowerCase();
     return (myNav.indexOf('msie') != -1 || myNav.indexOf('trident') != -1) ? true : false;
}

if(isIE()){
     $.getScript('js/script.min.js', function() {
            alert('Load was performed.');
     });
}

-1

このコードは私のブラウザで動作します:

<!--[if lt IE 9]>
  <script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
  <script src="https://oss.maxcdn.com/libs/respond.js/1.3.0/respond.min.js"></script>
<![endif]-->

このコードに関する注意:HTML5要素およびメディアクエリのHTML5 ShivおよびRespond.js IE8サポート

弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.