<! - [if! IE]> non funzionante


139

Ho problemi a ottenerlo

<!--[if !IE]>

lavorare. Mi chiedo se è perché ho questo nel mio documento

<!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]-->

Quando aggiungo

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

nella mia intestazione per qualche motivo non funziona. Tuttavia, se aggiungo

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

alla pagina HTML effettiva (nell'intestazione) funziona. Eventuali suggerimenti? Saluti

Aggiornamento alla mia domanda

Ok, quando ho rimosso <!-->ho controllato solo IE che funzionava, ma ora di nuovo in FF il no-ie.css era stato applicato anche a FF. Quindi ho aggiunto nuovamente in <!-->e rimosso / (e aggiunto quello nel modello principale in modo che i cms non lo aggiungessero di nuovo) e tutto funzioni nuovamente in FF ma ora il foglio di stile viene applicato a IE! Quindi ci ho provato

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

e

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

E quello non ha funzionato. Fondamentalmente sto cercando di far funzionare questa pagina http://css-tricks.com/examples/ResponsiveTables/responsive.php ma spostando il CSS in un foglio di stile. Sicuramente deve essere semplice. Cosa mi sto perdendo? Preferirei non usare JQuery se non dovessi. Saluti


1
Non è necessario <!-->immediatamente dopo il<!--[if !IE]>
techfoobar

29
Nota: se IE funziona solo fino a IE9.
Cameronjonesweb,

Alcune persone hanno lasciato divertenti messaggi IF IE su alcune pagine.
neverMind9

@cameronjonesweb puoi collegare un riferimento, altrimenti affermazioni come queste non sono così utili?
trainoasi,

@trainoasis, potrei, tranne il mio commento ha 5 anni
cameronjonesweb

Risposte:


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

Nota: questi commenti condizionali non sono più supportati da IE 10 in poi .


39
A partire da giugno 2013, questa è l' unica risposta corretta su questa pagina.
John B

2
A questa linea manca una parentesi angolare di chiusura? Non dovrebbe essere: <! - [if! IE]> <! -> <script src = "zepto.min.js"> </script> <! -> <! [Endif] ->
n00shie

1
Questo, insieme a tutte le altre soluzioni di commenti condizionali, non rileverà IE 10 / IE 11
Lloyd Banks,

9
Non funziona in IE 11, carica lo script, anche se la condizione è! IE
Giedrius,

49
@Giedrius Da IE10 in poi, i commenti condizionali sono più supportati : msdn.microsoft.com/en-us/library/ie/hh801214(v=vs.85).aspx
acdcjunior

70

Browser diversi da IE trattano le istruzioni condizionali come commenti perché sono racchiuse tra tag di commento.

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

Tuttavia, quando si sceglie come target un browser NON IE, è necessario utilizzare 2 commenti, uno prima e uno dopo il codice. IE ignorerà il codice tra di loro, mentre altri browser lo considereranno come un normale codice. La sintassi per il targeting di browser non IE è quindi:

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

Nota: questi commenti condizionali non sono più supportati da IE 10 in poi .


1
È fantastico. Grazie per quello Il foglio di stile funziona, tuttavia il problema che ho ora è che nella parte superiore della pagina sopra l'intestazione questo appare in <! - [if! IE] -> <! - [endif] -> (il tag è andato nell'area dell'intestazione non body)
user1516788

21
-1: questa risposta non è corretta perché non<!--[if !IE]-->IE ignores this<!--[endif]--> è nascosta da IE! (7, 8 o 9)
Giovanni B

3
Nessuna delle risposte ha funzionato per me, forse qualcosa è cambiato nella recente versione di IE10 (provato anche in modalità IE9). - Tutti i tentativi hanno raggiunto la sezione! IE su tutti i browser (IE e non IE).
Danny Varod,

2
IE10 non supporta le istruzioni condizionali.
Scorpius,

1
Fai attenzione agli spazi bianchi in <! - [if IE]> e <! [Endif] -> - non dovrebbero esserci spazi bianchi (ad es. Tra! - e [. Non funziona con gli spazi bianchi.
Robert Skarżycki,

37

Un aggiornamento se qualcuno raggiunge ancora questa pagina, chiedendosi perché il targeting ie non funziona. IE 10 e successivi non supportano più i commenti condizionali. Dal sito web ufficiale degli Stati Uniti:

Il supporto per i commenti condizionali è stato rimosso negli standard di Internet Explorer 10 e nelle modalità strane per una migliore interoperabilità e conformità con HTML5.

Per ulteriori dettagli, consultare qui: http://msdn.microsoft.com/en-us/library/ie/hh801214(v=vs.85).aspx

Se hai un disperato bisogno di target ie, puoi usare questo codice jquery per aggiungere una classe ie a e quindi usare la classe .ie nel tuo css per target ie browser.

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

Aggiornamento: $ .browser non è disponibile dopo jQuery 1.9. Se esegui l'aggiornamento a jQuery sopra 1.9 o lo usi già, puoi includere lo script di migrazione jQuery dopo jQuery in modo che aggiunga parti mancanti: jQuery Migrate Plugin

In alternativa, controlla questo thread per possibili soluzioni alternative: errore browser.msie dopo l'aggiornamento a jQuery 1.9.1


è davvero una bella soluzione! Non ho nemmeno bisogno di usarlo sull'albero dom per applicare determinate classi.
mmm

2
Si prega di notare che questo è obsoleto da jQuery 1.3 e rimosso in 1.9
Jøran

13

Lo uso e funziona:

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

Ciò si traduce in Firefox trattando l'intero contenuto come un commento per me. La soluzione @Charmander ha funzionato sia per IE che per Firefox - <! [If! IE]> <! [Endif]>
Tom Chamberlain

3
Nota: questi commenti condizionali non
Flimm,

12

La sintassi consigliata da Microsoft per i "commenti" condizionali rivelati a livello inferiore è questa:

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

Questi non sono commenti, ma funzionano correttamente.


Ho trovato questo link che supporta questa risposta, ha anche molte altre informazioni che potrebbero aiutare il thread, penso che questo sia un argomento importante ... l'unica differenza che vedo è se viene utilizzata una sintassi nascosta o rivelata e non sono sicuro di come questo effettuerà altri browser ... msdn.microsoft.com/en-us/library/ms537512.ASPX
user1360809

2
Nota: questi commenti condizionali non
Flimm,

8

Innanzitutto la sintassi corretta è:

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

Prova questo post: http://www.quirksmode.org/css/condcom.html e http://css-tricks.com/how-to-create-an-ie-only-stylesheet/

Un'altra cosa che puoi fare:

Controlla il browser con jQuery:

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

in questo caso è possibile modificare le regole CSS per alcuni elementi o aggiungere un nuovo riferimento al collegamento CSS:

leggi questo: http://rickardnilsson.net/post/2008/08/02/Applying-stylesheets-dynamically-with-jQuery.aspx


Vedere la risposta di user1324409 sopra per una risposta più accurata.
Chris Peters,

2
A causa degli aggiornamenti di jQuery, chiunque usi $ .browser.msie, dovrà includere jquery-migrate.js e quindi funzionerà.
Aspirante canadese il

1
Nota: questi commenti condizionali non
Flimm,

Il link fornito nella risposta è morto.
Pankaj,

8

È necessario inserire uno spazio per il <!-- [if !IE] --> blocco My full css nel modo seguente, poiché IE8 è terribile con le query multimediali

<!-- 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] -->

Grazie per il tuo commento, ma se uso <! - [if! IE] -> <link rel = "stylesheet" type = "text / css" href = "/ stylesheets / no-ie.csss" /> <! - [endif] -> quindi anche altri browser lo applicano.
user1516788

3
Non è questo il punto, avere altri browser applicare quella sezione?
John Hayford,

1
-1: La !IEtecnica menzionata qui eseguirà effettivamente il blocco commentato per IE 7 a 10.
Ian Campbell

1
Nota: questi commenti condizionali non
Flimm,

8

Per il targeting degli utenti IE:

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

Per il targeting di tutti gli altri:

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

I commenti condizionali possono essere rilevati solo da Internet Explorer, tutti gli altri browser lo inseriscono come normali commenti.

Per scegliere come target IE 6,7 ecc. È necessario utilizzare "Maggiore di uguale" o "Minore di (uguale)" nell'istruzione If. Come questo.

Maggiore o uguale:

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

Minore di:

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

Fonte: mediacollege.com


2
Nota: questi commenti condizionali non
Flimm,

7

Questo è fino a 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>

Questo è per dopo IE9

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

5

Per browser IE:

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

Per tutti i browser non IE:

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

Per tutti gli IE maggiori di 8 OPPURE tutti i browser non IE:

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

3

Il commento condizionale è un commento che inizia con il <!--[if IE]>quale non può essere letto da nessun browser tranne IE.

dal 2011 il commento condizionale non è supportato a partire dal modulo IE 10 come annunciato da Microsoft in quel momento https://msdn.microsoft.com/en-us/library/hh801214(v=vs.85).aspx

L'unica opzione per utilizzare i commenti condizionali è richiedere a IE di eseguire il tuo sito come IE 9 che supporti i commenti condizionali.

puoi scrivere i tuoi file css e / o js solo per esempio, e altri browser non lo caricheranno o eseguiranno.

questo frammento di codice mostra come far funzionare IE 10 o 11 ie-only.css e ie-only.js che contiene codici personalizzati per risolvere i problemi di compatibilità con IE.

    <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

Questo funziona per me su tutti i browser precedenti alla versione 6 (IE7, 8, 9, 10, ecc., Chrome 3 fino a quello che è ora e FF ver 3 fino a quello che è ora):

//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

Sto usando questo javascript per rilevare il browser 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

Grazie Fernando68, ho usato questo:

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

Ottengo questo codice funziona sul mio browser:

<!--[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]-->

Nota per questo codice: HTML5 Shiv e Respond.js Supporto IE8 di elementi HTML5 e query multimediali

Utilizzando il nostro sito, riconosci di aver letto e compreso le nostre Informativa sui cookie e Informativa sulla privacy.
Licensed under cc by-sa 3.0 with attribution required.