<! - [if! IE]> не работает

142

У меня проблемы с получением

<!--[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 (в заголовке) он работает. Какие-либо предложения? Ура

Обновите мой вопрос

Хорошо, когда я удалил, <!-->я проверил только 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/responsive.php, но переместите css в таблицу стилей. Конечно, это должно быть просто. Что мне не хватает? Я бы предпочел не использовать JQuery, если мне не нужно. Ура

user1516788
источник
1
Вам не нужно <!-->сразу после<!--[if !IE]>
techfoobar
30
Примечание: если IE работает только до IE9.
cameronjonesweb
Некоторые люди оставляли забавные сообщения IF IE на некоторых страницах.
neverMind9
@cameronjonesweb не могли бы вы дать ссылку на ссылку, иначе подобные утверждения не так полезны?
trainoasis
1
@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 года это единственный правильный ответ на этой странице.
JohnB
2
В этой строке отсутствует закрывающая угловая скобка? Если это не так: <! - [if! IE]> <! -> <script src = "zepto.min.js"> </script> <! -> <! [Endif] ->
n00shie 06
1
Это, наряду со всеми другими решениями с условными комментариями, не обнаружит IE 10 / IE 11
Ллойд Бэнкс
9
Он не работает в IE 11, он загружает скрипт, даже если условие равно! IE
Giedrius
50
@Giedrius Начиная с IE10, условные комментарии больше не поддерживаются : msdn.microsoft.com/en-us/library/ie/hh801214(v=vs.85).aspx
acdcjunior 03
71

Браузеры, отличные от IE, обрабатывают условные операторы как комментарии, поскольку они заключены в теги комментариев.

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

Однако, когда вы ориентируетесь на браузер, который НЕ является IE, вы должны использовать 2 комментария, один до и один после кода. IE игнорирует код между ними, тогда как другие браузеры будут рассматривать его как обычный код. Таким образом, синтаксис для настройки таргетинга на браузеры, отличные от IE:

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

Примечание. Эти условные комментарии больше не поддерживаются начиная с IE 10 .

user1324409
источник
1
Замечательно. Спасибо за это. Таблица стилей работает, однако проблема, с которой я сейчас сталкиваюсь, заключается в том, что в верхней части страницы над заголовком это отображается, например, <! - [if! IE] -> <! - [endif] -> (тег пошел в области заголовка, а не в теле)
user1516788 07
21
-1: Этот ответ неверен, потому что <!--[if !IE]-->IE ignores this<!--[endif]-->он не скрыт от IE! (7, 8 или 9)
JohnB 04
3
Ни один из ответов у меня не сработал, возможно, что-то изменилось в недавнем выпуске IE10 (также пробовал в режиме IE9). - Все попытки заканчивались достижением раздела! IE во всех браузерах (IE, а не IE).
Дэнни Варод
2
IE10 не поддерживает условные операторы.
Scorpius
1
Обратите внимание на пробелы в <! - [if IE]> и <! [Endif] -> - не должно быть пробелов (например, между! - и [. Это не работает с пробелами.
Роберт Skarżycki
37

Обновление, если кто-то все еще заходит на эту страницу, задаваясь вопросом, почему таргетинг не работает. IE 10 и более поздние версии больше не поддерживают условные комментарии. С официального сайта MS:

Поддержка условных комментариев была удалена в режимах стандартов и дополнительных возможностей Internet Explorer 10 для улучшения взаимодействия и соответствия HTML5.

Подробнее см. Здесь: http://msdn.microsoft.com/en-us/library/ie/hh801214(v=vs.85).aspx

Если вам отчаянно нужно настроить таргетинг, то есть, вы можете использовать этот код jquery для добавления класса ie, а затем использовать класс .ie в своем CSS для таргетинга, то есть браузеров.

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

Обновление: $ .browser недоступен после jQuery 1.9. Если вы обновляетесь до jQuery выше 1.9 или уже используете его, вы можете включить скрипт миграции jQuery после jQuery, чтобы он добавлял недостающие части: Плагин jQuery Migrate

В качестве альтернативы, пожалуйста, проверьте эту ветку на предмет возможных обходных путей: ошибка browser.msie после обновления до jQuery 1.9.1

Селай
источник
это действительно хорошее решение! Мне даже не нужно использовать его в дереве доменов для применения определенных классов.
ммм
2
Обратите внимание, что это устарело с jQuery 1.3 и удалено в 1.9
Йоран,
12

Я использую это, и это работает:

<!--[if !IE]><!--> if it is not IE <!--<![endif]-->
Фрэнсис
источник
В результате Firefox просто рассматривает все содержимое как комментарий для меня. Решение @Charmander работало как для IE, так и для Firefox - <! [If! IE]> <! [Endif]>
Том Чемберлен
3
Примечание. Эти условные комментарии больше не поддерживаются начиная с IE 10
Flimm
12

Рекомендуемый Microsoft синтаксис для условных «комментариев», обнаруженных на нижнем уровне, следующий:

<![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 выше для более точного ответа.
Крис Питерс
2
Из-за обновлений jQuery любой, кто использует $ .browser.msie, должен будет включить jquery-migrate.js, и тогда это будет работать.
AspiringCanadian
1
Примечание. Эти условные комментарии больше не поддерживаются начиная с IE 10
Flimm
Ссылка в ответе мертва.
Pankaj
8

Вам нужно поставить место для <!-- [if !IE] --> моего полного блока css следующим образом, поскольку IE8 ужасен с медиа-запросами

<!-- 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 08
3
Разве не в том, чтобы другие браузеры применяли этот раздел?
Джон Хейфорд
1
-1: !IEУпомянутая здесь методика фактически выполнит закомментированный блок для IE с 7 по 10.
Ян Кэмпбелл,
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]>

Для всех IE больше 8 ИЛИ всех браузеров, отличных от IE:

<!--[if (gt IE 8)|!(IE)]><!--><script src="/_JS/library/jquery-2.1.1.min.js"></script><!--<![endif]-->
Капил
источник
3

Условный комментарий - это комментарий, который начинается с <!--[if IE]>которого не может быть прочитан ни одним браузером, кроме IE.

с 2011 г. Условный комментарий не поддерживается, начиная с IE 10, как было объявлено Microsoft в то время https://msdn.microsoft.com/en-us/library/hh801214(v=vs.85).aspx

Единственный вариант использования условных комментариев - это запросить IE для запуска вашего сайта как IE 9, который поддерживает условные комментарии.

вы можете написать свои собственные файлы css и / или js, т.е. только, и другие браузеры не будут загружать и выполнять их.

этот фрагмент кода показывает, как заставить IE 10 или 11 запускать файлы ie-only.css и ie-only.js, которые содержат специальные коды для решения проблем совместимости 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>
Шади Мохамед Шериф
источник
2

Это работает для меня во всех браузерах выше версии 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;
        }
Фанданго68
источник
1

Если вы работаете с IE 10 или выше, как указано в http://tanalin.com/en/articles/ie-version-js/, условные комментарии больше не поддерживаются. Вы можете обратиться к https://gist.github.com/jasongaylord/5733469 в качестве альтернативного метода, версия Trident которого также проверяется с помощью navigator.userAgent. Это также проверено, если браузер работает в режиме совместимости.

Тошихико
источник
1

Спасибо, 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.');
     });
}
Родриго Празим
источник
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");
}
Муфликс
источник
-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 Shiv и Respond.js IE8 элементов HTML5 и медиа-запросов

Четабахана
источник