Как бы мы не хотели не иметь дела со всяческими багами в IE, нужно смотреть правде в глаза, потому что Ваш босс, и посетители все еще используют Internet Explorer. Это неприятно, особенно, учитывая, что различные версии браузера отображают веб-страницы по-разному из-за противоречивого рендеринга. Мы обычно используем условные комментарии, чтобы решить проблемы с IE. Но, вобщем-то, есть и другие возможности, о которых сейчас и пойдет речь.








№1 IE-условные комментарии



Это наиболее распространенный метод исправления ошибок для конкретных версий браузера (IE6, IE7, IE8). Вот как это выглядит:

 <!--[if IE 8]> = IE8
<!--[if lt IE 8]> = IE7 или ниже
<!--[if gte IE 8]> = IE8 или выше


На практике это зачастую выглядит как-то так:

 <!--[if IE 8]>

<style type="text/css">

/* css for IE 8 */

</style>

<![endif]-->


или

<!--[if lt IE 8]>

<link rel="stylesheet" href="InternetExplorer7.css" type="text/css" />

<![endif]-->




№2 CSS-правила специфичные для Internet Explorer (CSS-хаки для IE)



Еще один вариант – CSS правила, понятные только для IE. Например, звездочка(*) в начале CSS свойства означает, что правило будет применяться только в IE7. Добавление же подчеркивания (_) перед CSS свойством укажет, что его следует применять только в IE6. Однако эти методы не рекомендуются, поскольку приводят к некорректному CSS синтаксису.

IE8 или ниже: CSS правило для этих версий браузера должно содержать «\9» в конце перед точкой с запятой.

IE7 или ниже: добавление звездочки (*) перед CSS правилом.

IE6: добавление подчеркивания (_) перед свойством.

Пример:

.box {

background: red; /* стандартное правило */

background: green\9; /* IE8 или ниже */

*background: blue; /* IE7 или ниже */

_background: black; /* IE 6 */

}




№3 Условный CSS класс для HTML



Третий способ является вариантом первого, придуманным Полом Айришем. Он состоит в том, чтобы с помощью IE-условных комментариев присвоить тегу CSS класс с соответствующей версией IE. Обычно, мы просто проверяем, IE ли это и если да, то добавляем тегу html необходимый класс. Для того чтоб делать изменения для определенной версии IE, используйте класс как родительский селектор (например, .ie6 .box). Это удобный способ и он не взывает никаких ошибок в валидации.



<!--[if lt IE 7 ]> <html class="ie6"> <![endif]-->

<!--[if IE 7 ]> <html class="ie7"> <![endif]-->

<!--[if IE 8 ]> <html class="ie8"> <![endif]-->

<!--[if IE 9 ]> <html class="ie9"> <![endif]-->

<!--[if (gt IE 9)|!(IE)]><!--> <html> <!--<![endif]-->

1

Комментарии

Для того, чтоб оставлять комментарии или зарегистрируйтесь.