Это сайт — моя персональная записная книжка. Интересна мне, по большей части, история, своя жизнь и немного программирование.

Фильтрация CSS по браузеру

Я как-то уже писал о том как подключить целый блок CSS только для FireFox, но чаще нужно подключить не блок, а всего один-два стиля. В этом случае удобно воспользоваться тем фактом, что браузер обязан игнорировать стиль, если в селекторе встречается что-то незнакомое.

Способ для FireFox мне подсказали в комментариях на «Хабре», для Internet Explorer я придумал его самостоятельно. Вот пример, иллюстрирующий идею:

.class { color: black } /* для всех остальных браузеров */
.class, noindex:-moz-any-link { color: blue } /* стиль только для Mozilla FireFox */
.class, v\:* { color: red } /* стиль только для Internet Explorer */

Можете попробовать самостоятельно — фильтрует идеально. В примере класс «class» даст тегу, к которому его применят, в FireFox — голубой цвет текста, в IE — красный, а в остальных браузерах — чёрный.

11 комментариев
zencd.livejournal.com 2008

а что за логика в случае с IE, почему он её «съедает»?

Евгений Степанищев (bolknote.ru) 2008

Комментарий для zencd.livejournal.com:

С точки зрения других браузеров это невалидный селектор, а в IE он используется для всех тегов какого-либо пространства имён, «v» — это VML ( http://www.w3.org/TR/NOTE-VML ), который всё равно никто не использует, вот я его сюда и вписал.

astur (astur.net.ru) 2008

потрясающе!

astur (astur.net.ru) 2008

Жень, а зачем у тебя с Гаватара картинка просится, когда myopenid.com её сам отдаёт вместе с е-мейлом?

gluek.info 2008

Т. е. этим постом Евгений нам как бы говорит, что все пользователи Firefox — голубые (смайлик).

Евгений Степанищев (bolknote.ru) 2008

Комментарий для astur.net.ru:

myopenid её не отдаёт. Он использует pavatar.

Евгений Степанищев (bolknote.ru) 2008

Комментарий для gluek.info:

Игры подсознания, да ;)

blog.ad.by 2008

Комментарий для Евгения Степанищева:

Просьба не обижать VML. 8-) Я его использую. Смотри в блоге.

yakushevsky (id.yakushevsky.com) 2008

Для эксплорера достаточно запятой:
.class, { color: red } /* стиль только для Internet Explorer */

Точнее для всех остальных браузеров достаточно этого, чтобы пропустить правило.

Евгений Степанищев (bolknote.ru) 2008

Комментарий для id.yakushevsky.com:

Ну, это баг, его могут поправить.

Евгений Степанищев (bolknote.ru) 2008

Комментарий для blog.ad.by:

О! надо же :)