Как вставить html-код только для Internet Explorer?

2010-05-09

Разработчики Internet Explorer (далее IE) добавили такую индивидуальную возможность.
Во-избежание различий в дизайне, css-стилях, javascript-коде в различных веб-браузерах иногда приходится применять индивидуальные решения. Для IE это приходится делать чаще всего. Что самое интересное, что для различных версий этого браузера часто фиксы бывают тоже разные.
К примеру: прозрачность картинок в формате PNG не работает в IE6, но в последующих версиях уже работает.
А иногда приходится отключать какую-то «тяжелую впечатляющую возможность» для «слабых» браузеров, чтобы не перегружать их, или чтобы не оптимизировать этих возможностей, на что может уйти много сил и времени.

Как же это делается?
В HTML-коде есть такое понятие как комментарии. Это то, что все веб-браузеры игнорирует и не отображает. Они просто на них не смотрят при подготовке исходного кода страницы.
Реализуются комментарии так:

<!-- мои комментарии -->

Разработчики IE использовали эту фичу для того, чтобы дать веб-разработчикам возможность внедрять свой индивидуальный код:

<!--[if IE]>
Этот код виден только для IE
<![endif]-->

Этот механизм позволяет применять код к различным версиям Internet Explorer. В квадратных скобках нужно прописать, то что Вам нужно.
Доступны такие спецификации:

  • IE — любая версия Internet Explorer;
  • IE 5 — Internet Explorer 5;
  • IE 5.5 — Internet Explorer 5.5;
  • IE 6 — Internet Explorer 6;
  • IE 7 — Internet Explorer 7;
  • IE 8 — Internet Explorer 8;
  • IE 9 — Internet Explorer 9;
  • lt — версия меньше указанной;
  • gt — версия больше указанной;
  • lte — версия меньше или равна указанной;
  • gte — версия больше или равна указанной.

Пример 1: Подключение стилей с файла «style_ie.css» только для Internet Explorer

<!--[if IE]>
<link href="/css/style_ie.css" type="text/css" />
<![endif]-->

Пример 2: Подключение внешнего javascript-скрипта только для Internet Explorer весрии 6-й и ниже

<!--[if lte IE 6]>
<script src="/js/ie6-fix.js" type="text/javascript"></script>
<![endif]-->

Также есть возможность использовать данных подход с точностью до наоборот, а точнее — отображать html-код во всех веб-браузерах кроме IE.
Пример 3:

<!--[if !IE]>-->
Для всех веб-браузеров кроме IE
<!--<![endif]-->

Обобщающий пример:

Для всех браузеров<br>
<!--[if !IE]>--> Все кроме IE<br> <!--<![endif]-->
<!--[if IE]> Для всех версий IE<br> <![endif]-->
<!--[if IE 6]> Для IE6<br> <![endif]-->
<!--[if IE 7]> Для IE7<br> <![endif]-->
<!--[if IE 8]> Для IE8<br> <![endif]-->
<!--[if IE 9]> Для IE9<br> <![endif]-->
<!--[if lte IE 7]> Для IE версий <= 7й<br> <![endif]-->
<!--[if lt IE 7]> Для IE версий < 7й<br> <![endif]-->
<!--[if gt IE 7]> Для IE версий > 7й<br> <![endif]-->
<!--[if gte IE 7]> Для IE версий >= 7й<br> <![endif]-->



10 комментариев на «Как вставить html-код только для Internet Explorer?»

  1. Alexandr:

    Спасибо, данный пост очень помог в создании странички

  2. Алексей В.:

    Спасибо, действительно полезная статья. Очень сильно помогла ))))

  3. Иван Проценко:

    Хорошая статья. Помогла нереально!

  4. @GlebVelikanov:

    Самое классное решение всех проблем с IE выглядит примерно так:

  5. @GlebVelikanov:



    Поменяйте браузер!

  6. @GlebVelikanov:

    Самое классное решение всех проблем с IE выглядит примерно так:

    <!—[if IE]>
    Поменяйте браузер!
    <![endif]—>

  7. Алексей:

    Отображать html-код во всех веб-браузерах кроме IE — работает…, а остальное нет :(

  8. Игорёк:

    Спасибо, очень познавательно

  9. Просто Джексон:

    Спасибо автору! Полезная информация

  10. JAMLIGHT:

    как для Ie11 добавить стиль?

Добавить комментарий