<!--[if !IE]> not working

2019-01-02 14:16发布

I'm having trouble getting

<!--[if !IE]>

to work. I'm wondering if it is because I have this in my document

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

When I add

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

to my header for some reason it doesn't work. However if I add

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

to the actual html page (in the header) it works. Any suggestions? Cheers

Update to my question

Ok, when I removed <!-->I only checked in IE which was working but now back in FF the no-ie.css had been applied to FF too. So I added back in the <!-->and removed the / (and added that into the main template so the cms wouldn't add it back in) and all is working back in FF but now the stylesheet is being applied to IE! So I tried

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

and

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

And that didn't work. Basically I'm trying to get this page to work http://css-tricks.com/examples/ResponsiveTables/responsive.php but move the css into a stylesheet. Surely it's got to be simple. What am I missing? I'd rather not use JQuery if I don't have to. Cheers

16条回答
回忆,回不去的记忆
2楼-- · 2019-01-02 14:47

An update if somebody still reaches this page, wondering why the ie targeting doesnt work. IE 10 and onward no longer support conditional comments. From the MS official website:

Support for conditional comments has been removed in Internet Explorer 10 standards and quirks modes for improved interoperability and compliance with HTML5.

Please see here for more details: http://msdn.microsoft.com/en-us/library/ie/hh801214(v=vs.85).aspx

If you desperately need to target ie, you can use this jquery code to add a ie class to and then use .ie class in your css to target ie browsers.

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

Update: $.browser is not available after jQuery 1.9. If you upgrade to jQuery above 1.9 or you already use it, you can include jQuery migration script after jQuery so that it adds missing parts: jQuery Migrate Plugin

Alternatively, please check this thread for possible workarounds: browser.msie error after update to jQuery 1.9.1

查看更多
只靠听说
3楼-- · 2019-01-02 14:48

In case you are working with IE 10 or above, as mentioned in http://tanalin.com/en/articles/ie-version-js/ the conditional comments are no longer supported. You might refer to https://gist.github.com/jasongaylord/5733469 as an alternative method, which the Trident version is checked as well from the navigator.userAgent. This also verified in case the browser is working in compatibility mode.

查看更多
不流泪的眼
4楼-- · 2019-01-02 14:49

I use that and it works :

<!--[if !IE]><!--> if it is not IE <!--<![endif]-->
查看更多
牵手、夕阳
5楼-- · 2019-01-02 14:49

You need to put a space for the <!-- [if !IE] --> My full css block goes as follows, since IE8 is terrible with media queries

<!-- IE 8 or below -->   
<!--[if lt IE 9]>
<link rel="stylesheet" type="text/css"  href="/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="/Resources/css/master1300.css" />
<link rel="stylesheet" type="text/css" media="(max-width: 480px)"
    href="/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] -->
查看更多
像晚风撩人
6楼-- · 2019-01-02 14:49

For IE browser:

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

For all non-IE browsers:

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

For all IE greater than 8 OR all non-IE browsers :

<!--[if (gt IE 8)|!(IE)]><!--><script src="/_JS/library/jquery-2.1.1.min.js"></script><!--<![endif]-->
查看更多
素衣白纱
7楼-- · 2019-01-02 14:50

This works for me across all browsers greater than version 6 (IE7, 8, 9, 10, etc, Chrome 3 up to what it is now, and FF ver 3 up to what it is now):

//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;
        }
查看更多
登录 后发表回答