CSS-фильтр для Gecko
- «Полосатые таблицы» средствами CSS
(18189 / 4) - Вертикальное выравнивание текста
(9274 / 3) - Таблицы с вертикальным направлением текста
(7317 / 5) - Закругляем уголки границ у блоков
(6996) - Всплывающие подсказки в духе AJAX
(6377 / 6) - Internet Explorer 7, что изменилось в поведении браузера?
(4161) - CSS-фильтр для Gecko
(4044) - CSV на веб-страницах
(3746) - Текст с переливом
(3554) - Табличная верстка блоками
(2311 / 11)
Любой сознательный веб-работник понимает, что всевозможных фильтров и хаков лучше избегать, особенно когда речь идет о фильтрации в среде «продвинутых на стандартах» браузерах. В большинстве случаев нет необходимости определять стили, к примеру, отдельно для Firefox и Opera. Но что делать, если такая потребность все же есть?
В этом случае, можно воспользоваться CSS-селекторами, которые поддерживаются браузерами на движке Gecko, но при этом игнорируются остальными передовыми веб-проводниками. На текущий момент для наших целей вполне подойдут псевдо-элемент :root или псевдо-класс :not(). Оба приняты на вооружение Gecko, начиная с версии 0.9.
Рассмотрим технику на конкретных примерах. Возьмем див <div id="example">Какой-нибудь текст</div>:
#example{
padding:0.5em;
border:2px solid #ccc;
color:#ccc;
text-align:center;
}
и опишем для него дополнительные стили, воспользовавшись
-
:root(поддерживается Gecko, IE/Mac, Safari):root #example{ border-color: green; color: green; }Какой-нибудь текст -
:not()(поддерживается Gecko, Safari)#example:not(body){ border-color: green; color: green; }Какой-нибудь текст
Если указанные инструкции работают, то текстовое содержимое и границы блоков в приведенных примерах будут зеленного цвета.
Оставить отзыв | Комментарии (0)