[ главная ]   [ рейтинг статей ]   [ справочник радиолюбителя ]   [ новости мира ИТ ]



Ответов: 0
25-02-12 07:01







   Web - программирование
PHP


ASP






XML



CSS

SSI





   Программирование под ОС











   Web - технологии








   Базы Данных









   Графика






Данные




Web - программирование / CSS /

Персональный CSS хак для Internet Explorer 7

Автор: http://suprabiz.com/

Очень не люблю при верстке использовать для IE так называемые условные комментарии (Conditional Comments) - нет желания писать отдельный файл стилей (предпочитаю “все в одном”), да и лишние строки в хтмл-коде - не есть красиво.

С относительно недавнего времени к трем браузерам, в которых я просматриваю результат верстки, как было ранее (Opera, FireFox, IE 6.0), добавился еще один - Internet Explorer 7 (теперь их 4 - какой ужас!). А, соответственно, случаются ситуации, когда определенный стиль нужно применить только для 7-й версии ИЕ.

Попался мне на глаза CSS хак для Internet Explorer 7, который я раньше не встречал: *:first-child+html.

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

Пример кода

  1. p.test1 {
  2.   background: #FAA;
  3. }
  4. *:first-child+html p.test1 {
  5.   background: #95FF95;
  6. }

Список браузеров, поддерживающих хак:

  • Internet Explorer 7

Список браузеров, которые не поддерживают хак:

  • IE 4-6/Win
  • FireFox
  • NS 6.0-7.2
  • NS 4.x
  • Opera 5+
  • Safari
  • Konqueror 3
  • iCab 3
  • IE 5.x/Mac

IE 5.5 и IE 6 будет игнорировать любое правило, которое использует этот хак, даже если описывается цепочка селекторов, разделенных запятыми. Чтобы убедиться в этом, посмотрим на еще один тест.

Пример кода

  1. p.test2 {
  2.   background: #FAA;
  3. }
  4. * html p.test2 {
  5.   background: #FF8;
  6. }
  7. *:first-child+html p.test2,
  8. * html p.test2 {
  9.   background: #95FF95;
  10. }

Если фоновый цвет данного абзаца зеленый, значит хак работает. Если фон желтый, значит браузер поддерживает хак “* html” и игнорирует второе правило (для IE 7).

До сегодняшнего для указания персональных стилей для IE 7 я использовал следующую конструкцию (хак):

  1. * body p.test {
  2.   background: #95FF95;
  3. }

А каким образом Вы задаете CSS-стили для браузера Internet Explorer 7?




Комментарии

 Ваш комментарий к данному материалу будет интересен нам и нашим читателям!



Последние статьи: Web - программирование / CSS /

Font-size от xx-small до xx-large
05-01-2010   

Проблема размера шрифтов всегда волнует веб-разработчиков. В CSS есть семь ключевых слов для обозначения размера шрифта. Они введены для того, чтобы дизайнеры особо не напрягались над проблемами доступности текстов на страницах. Размер варьируется от xx-small до xx-large и этот размер берется относительно установленного пользователем в браузере размера medium. Вот что мы видим в спецификации CSS-1... подробнее

Кол. просмотров: общее - 3823 сегодня - 0

История про CSS (часть II)
05-01-2010   

Продолжаем разговор о применении таблиц стилей. Сначала разберемся с каскадностью стилей, а потом перейдем к рассмотрению синтаксиса и обзору наиболее часто встречающихся параметров, применяемых при создании стилей... подробнее

Кол. просмотров: общее - 3789 сегодня - 0

Трюк с курсором
05-01-2010   

Наверно вы уже заметили, что на некоторых сайтах при наведении на ссылки появляется... совсем не рука, которая многим уже надоела, а какая-нибудь там стрелка, часы и т.п. Как это сделать? Очень просто! Надо всего лишь добавить стиль курсора в код ссылки. Пример кода... подробнее

Кол. просмотров: общее - 3716 сегодня - 0

Необычное применение CSS: реализация эффекта rollover c помощью CSS
05-01-2010   

Эрик Мейер нашел очень интересное использование псевдо-класса :hover. Оказывается, с помощью свойства display, контекстного селектора и :hover можно реализовать эффект rollover, когда при наведении мышкой появляется картинка. Делается это следующим образом... подробнее

Кол. просмотров: общее - 3615 сегодня - 1

Сокращенные команды в CSS
05-01-2010   

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

Кол. просмотров: общее - 4450 сегодня - 0



  WWW.COMPROG.RU - 2009-2012 | Designed and Powered by Zaipov Renat | Projects