встроенный хак CSS ниже IE9? (или все браузеры, не поддерживающие CSS3) - PullRequest
1 голос
/ 13 января 2012

Мне нужен взлом, чтобы tarjet Internet Explorer опустился до 9, или, если быть более точным; мне нужен встроенный CSS-хак для таргетинга не поддерживающих CSS3 браузеров

_prop:val -> ie6
*prop:val -> ie6 & ie7
????????? -> ie8 & ie7 & ie8

Я использую градиенты и изображения для этих браузеров, но ie8 не поддерживает его ... поэтому я хочу загрузить альтернативное изображение только при необходимости

( пожалуйста, избегайте ответов , предлагающих использовать внешнюю таблицу стилей с использованием условных комментариев или с помощью javascript. Я знаю, что этот код будет недействительным, но это только для одной маленькой вещи. Плюс мне интересно знать, если это возможно :))

Ответы [ 3 ]

4 голосов
/ 13 января 2012

Вам не нужен взлом, так как no текущий браузер поддерживает все CSS3.

Вместо этого просто укажите резервные свойства для старых браузеров, например:

#selector {
    background: url("gradient.png");
    background: gradient(...);
}
4 голосов
/ 13 января 2012

Я использую градиенты в IE8 в проекте. Это работает!

 <style>
        #gradient {
            color: #fff;
            height: 100px;
            padding: 10px;
            /* For WebKit (Safari, Google Chrome etc) */
            background: -webkit-gradient(linear, left top, left bottom, from(#00f), to(#fff));
            /* For Mozilla/Gecko (Firefox etc) */
            background: -moz-linear-gradient(top, #00f, #fff);
            /* For Internet Explorer 5.5 - 7 */
            filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#FF0000FF, endColorstr=#FFFFFFFF);
            /* For Internet Explorer 8 */
            -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#FF0000FF, endColorstr=#FFFFFFFF)";
        }
    </style>

для тени ящика есть обходной путь, подобный этому:

.shadow {  
    zoom: 1;  
    filter: progid:DXImageTransform.Microsoft.Shadow(color='#999999', Direction=0, Strength=3)  
    progid:DXImageTransform.Microsoft.Shadow(color='#999999', Direction=45, Strength=2)  
    progid:DXImageTransform.Microsoft.Shadow(color='#999999', Direction=90, Strength=3)  
    progid:DXImageTransform.Microsoft.Shadow(color='#999999', Direction=135, Strength=2)
    progid:DXImageTransform.Microsoft.Shadow(color='#999999', Direction=180, Strength=3)
    progid:DXImageTransform.Microsoft.Shadow(color='#999999', Direction=225, Strength=2)
    progid:DXImageTransform.Microsoft.Shadow(color='#999999', Direction=260, Strength=3)  
    progid:DXImageTransform.Microsoft.Shadow(color='#999999', Direction=305, Strength=2);  
     -moz-box-shadow: 0 0 5px #222; /*Mozilla-basierte Browser (z.B. Firefox)*/ 
     -webkit-box-shadow: 0 0 5px #222; /*WebKit-basierte Browser (z.B. Safari/Chrome)*/ 
     box-shadow: 0 0 5px #222; /*CSS3 Standard*/ 
 } 

для border-radius нет поддержки до ie9, насколько я знаю. Я использую несколько плагинов jQuery для достижения границы радиуса в IE. надеюсь, что этот код помог вам!

1 голос
/ 13 января 2012

Вам нужно использовать это:

prop: val\9

Помещение \ 9 непосредственно в конец любого значения будет нацелено только на IE8 и ниже

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...