CSS хаки для IE, Chrome, Safari, Mozila

Опубликовано admin - вс, 06/03/2018 - 16:34

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

Оглавление статьи "CSS хаки для IE, Chrome, Safari"

Условные комментарии

Суть условных комментариев состоит в том, чтобы вместо слова condition подставить одно изо допустимых условий, приведу значения условий:

IE Если это Internet Exlorer
lt IE version Версия Internet Exlorer меньше значения version
lte IE version Версия Internet Exlorer меньше или равная значению version
IE version Версия Internet Exlorer равная значению version
gte IE version Версия Internet Exlorer больше или равная значению version
gt IE version Версия Internet Exlorer больше чем значение version, допустимые значения - 5, 5.5, 6 или 7

К примеру, Вы можете написать:

что будет означать - установить цвет фона всем элементам div как красный для браузеров Internet Explorer версий 7 и ниже. Или наоборот:

Дополнительный пример условных комментариев для Internet Eplorer:

Существуют так называемые отрицательные условные комментарии, синтаксис которых следующий:

Селекторы как CSS хаки

С условными комментариями закончим, перейдём к селекторам, следующий селектор поддерживается только браузером IE 6

Следующий селектор пригоден только для седьмой версии IE и ниже

Следующий селектор пригоден только для седьмой версии IE

Для браузера Opera 9 и белее старых версий данного браузера

Правила как CSS хаки

Правила CSS например !important так же могут служить CSS хаками в некоторых случаях, например, для того чтобы все браузеры отобразили цвет фона зелёным, кроме IE 6 версии (для этого браузера фон будет красным), нужно написать следующий стиль:

IE 7 версии и ниже так же игнорирует селектор @import, и последующее за ним целое css правило:

Хаки для Webkit и Safari

Правило содержащееся между фигурными скобками будет работать только в Chrome и Safari 4

Правило содержащееся между фигурными скобками будет работать только в Chrome и Safari 3.1

IE6, IE7, IE8 никогда не будут поддерживать данный код. Более новые версии браузеров - Safari, Chrome и Firefox данный код так же поддерживают.

Теги

Оценка

1 votes with an average rating of 5.

На разработку сайта! Скидки до 20%!