Условные комментарии (conditional comments)

Вы используете условные комменарии? Конечно, вы их используете. Чтобы отделить стили для IЕ от других и при этом сохранить валидность своего CSS. Тем самым добавляя лишние http-запросы для все еще  многочисленных несчастных пользователей IЕ. Да еще в некоторой степени затрудняя себе правки стилей, если какое-либо свойство различается и для нормальных браузеров, и для IE7, и для IЕ6. Приходится править три файла, а не один. Можно забыть, запутаться, ну в общем неудобно.

Можно ли этого избежать (этого — это неудобства, лишние http-запросы и т.п.)? Да, и при этом с помощью все тех же условных комментариев! Кажется в начале года встретил на каком-то сайте (честно, не помню) подобный рецепт. Достаточно в вашем HTML с помощью условных комментариев разделить вывод в браузер BODY с различными классами. Вот как-то так:

<!--[if (!IE) | (gt IE 7)]><!-->

    <body>

<!--><![endif]-->

<!--[if IE 7]>

    <body class="ie7">

<![endif]-->

<!--[if IE 6]>

    <body class="ie6">

<![endif]-->

Пример (соответственно приведенному примеру нормальные браузеры покажут красный экран, IЕ7 — зеленый, а IЕ6 — синий ).

Теперь у вас есть возможность, не используя хаки и не плодя лишние файлы, править все стили в одном файле. Достаточно в  стилях перед нуждающимся в корректировке для IЕ7 или IЕ6 свойством  писать соответсвующий класс.

для нормальных браузеров:

.selector {attr: value }

для IЕ7:

.ie7 .selector {attr: new value} - это свойство увидит только IЕ7

ну и соотвественно для IЕ6:

.ie6 .selector {attr: new value} - а это  только IЕ6

Вы скажете, что стили будут сильно много весить. Да, немного потяжелеют, но если у вас правильно все сверстано, то много правок не понадобится. Это раз. Второе, несколько лишних строк все-таки лучше, чем пара лишних запросов к серверу.

P.S. Единственно, что если вам приходится использовать фильтры или expression для IЕ, то валидность CSS сохранить не удастся. Но, по-моему, важнее валидность HTML, чем CSS. Потому как валидность CSS никак не влияет на доступность сайта, а только лишь на его отображение.

2 thoughts on “Условные комментарии (conditional comments)”

Обсуждение закрыто.