Таблицы стилей, совместимые с IE 9

Я привык к таблицам стилей, в которых есть отдельные правила для браузеров IE и не IE. Например, я использовал CSS3 Pie для создания закругленных углов и градиентов в IE.

Проблема в том, что IE 9 поддерживает закругленные углы и градиенты и больше не нуждается в подобных обходных приемах. Как я могу переписать мою таблицу стилей, чтобы гарантировать, что поведение применимо только к IE 8-, а не к IE 9?

Спасибо!

Изменить: вот пример с сайта CSS3 Pie, где правила избыточны для IE 9: http://css3pie.com/demos/tabs/


css internet-explorer-9 css3pie
person Christophe    schedule 14.04.2011    source источник
comment
CSS3Pie отключается при обнаружении IE9, поэтому вам не нужно делать ничего особенного для него по сравнению с другими браузерами в этом отношении.   -  person Spudley    schedule 15.04.2011
comment
см. css3pie.com/2010/12/06/ пирог-1-0-бета-3-выпущен. Цитата: Отключено в IE9. Эта ссылка - примечания к выпуску бета-версии 3; текущая версия - это бета 4, в которой этот код был немного изменен, но в IE9 он по-прежнему в основном отключен.   -  person Spudley    schedule 15.04.2011
comment
Очень полезно, спасибо Спадли! Обратите внимание, что мой первоначальный вопрос не относился к CSS3 Pie, я просто взял его в качестве примера.   -  person Christophe    schedule 16.04.2011

Ответы (3)


arrow_upward
5
arrow_downward

Обычный подход заключается в использовании условных комментариев и отдельной таблицы стилей исправлений для каждой его версии:

<!--[if IE 7]><style type="text/css">@import "ie7-kludges.css";</style><![endif]-->
<!--[if IE 8]><style type="text/css">@import "ie8-kludges.css";</style><![endif]-->
<!--[if IE 9]><style type="text/css">@import "ie9-kludges.css";</style><![endif]-->

Таким образом, вы можете использовать стандартный CSS в своей основной таблице стилей, а затем накладывать на все клуджи и ерунду, которые вам нужны, чтобы заставить каждую версию IE вести себя правильно. Каждой версии IE обычно нужны разные кладжи, поэтому я помещаю их в разные таблицы стилей.

person mu is too short    schedule 14.04.2011
comment
Есть ли причина использовать стиль @import вместо ссылки в этом случае? - person Christophe; 14.04.2011
comment
@Christophe: Нет веской причины, я просто взял существующий пример из одного из моих репозиториев, который использовал @import, а не <link>. - person mu is too short; 14.04.2011

arrow_upward
1
arrow_downward

См. Некоторые ответы здесь Как настроить таргетинг на IE7 и IE8 с помощью правильный CSS?

и здесь селектор IE8 css

person Daveo    schedule 14.04.2011

arrow_upward
1
arrow_downward

Трудно сказать, как что-то переписать, если мы не видим оригинал. В общем, обычная передовая практика работы с IE - использование условных комментариев IE в той или иной форме. Что я обычно делаю, так это через указанные комментарии выписываю тег тела с классом, соответствующим конкретной версии IE. Итак, для IE7 я могу получить следующее:

<body class="ie7">

Таким образом, в моем CSS я могу использовать специфичность, чтобы придать ie7 свой собственный стиль, без необходимости прибегать к взломам и без необходимости управлять стилями в нескольких файлах css.

.something {...style for good browsers...}
.ie7 .something {...fix IE 7 here...}
person DA.    schedule 14.04.2011
comment
В ПОРЯДКЕ. Мой ответ касается этого. Дай мне знать, если что-то непонятно. - person DA.; 14.04.2011
comment
+1 Теперь, когда я начал играть с этим, я лучше понимаю, как этот метод помогает уменьшить количество таблиц стилей. - person Christophe; 30.04.2011