Заметки веб-работника
18 марта 2006

CSS-фильтр для Gecko

Любой сознательный веб-работник понимает, что всевозможных фильтров и хаков лучше избегать, особенно когда речь идет о фильтрации в среде «продвинутых на стандартах» браузерах. В большинстве случаев нет необходимости определять стили, к примеру, отдельно для 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;
}
и опишем для него дополнительные стили, воспользовавшись
  1. :root (поддерживается Gecko, IE/Mac, Safari)
    :root #example{
       border-color: green;
       color: green;
    }
    Какой-нибудь текст

  2. :not() (поддерживается Gecko, Safari)
    #example:not(body){
       border-color: green;
       color: green;
    }
    Какой-нибудь текст

Если указанные инструкции работают, то текстовое содержимое и границы блоков в приведенных примерах будут зеленного цвета.



 

Оставить отзыв | Комментарии (0)