есть ли IE8 только css взломать? - PullRequest
27 голосов
/ 15 июня 2010

Для Internet Explorer 8 (IE8) я хотел бы использовать следующий CSS:

color : green;

Я хотел бы применить хак, который влияет только на IE8, а не на IE9, IE6 и 7.

Ответы [ 11 ]

43 голосов
/ 15 июня 2010

Используйте условные комментарии в HTML, например:

<!--[if IE 8]>
<style>...</style>
<![endif]-->

См. Здесь: http://www.quirksmode.org/css/condcom.html

Вы можете проверять версии IE надежно, а также быть уверенными, что другие браузеры не будутзапутался.

35 голосов
/ 11 января 2012

Используйте медиазапросы для разделения каждого браузера:

/* IE6/7 uses media, */
@media, { 
        .dude { color: green; } 
        .gal { color: red; }
} 

/* IE8 uses \0 */
@media all\0 { 
        .dude { color: brown; } 
        .gal { color: orange; }
} 

/* IE9 uses \9 */
@media all and (monochrome:0) { 
          .dude { color: yellow\9; } 
          .gal { color: blue\9; }
} 

/* IE10 and IE11 both use -ms-high-contrast */
@media all and (-ms-high-contrast:none)
 {
 .foo { color: green } /* IE10 */
 *::-ms-backdrop, .foo { color: red } /* IE11 */
 }

Ссылки

15 голосов
/ 16 июня 2010

Используйте \0.

color: green\0;

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

Несмотря ни на что, у меня никогда не было необходимости взламывать IE8.Что это, специфическая проблема IE8, которую вы хотели бы решить?Это рендеринг в режиме стандартов IE8 в любом случае?Его рендерер довольно хорош.

8 голосов
/ 30 июня 2014

Если необходимы небольшие изменения в CSS, используйте \ 9 , он нацелен на IE8 и ниже (IE6, IE7, IE8)

.element { 
   color:green \9;
 }

Лучший способ - использовать условные комментарии в HTML, напримерэто:

<!--[if IE 8]>
<style>...</style>
<![endif]-->
2 голосов
/ 04 апреля 2016

Таким образом, недавний вопрос побудил меня заметить взлом набора селекторов для исключения только IE 8 .

.selector, #excludeIE8::before {} приведет к тому, что IE 8 выбрасывает весь набор селекторов, в то время как 5-7 и 9-11 будут читать его очень хорошо. Любой из :: селекторов (::first-line, ::before, ::first-letter, ::selection) будет работать, я просто выбрал ::before, поэтому строка читается точно. Обратите внимание, что целью селектора fake ::before является be fake, поэтому обязательно измените его на что-то другое, если у вас действительно есть элемент с идентификатором excludeIE8

Интересно, что в современных браузерах (FF 45-52, GC 49-57, Edge 25/13) плохой селектор :: съедает весь набор селекторов ( dabblet demo ). кажется , что последняя версия Safari для Windows (и LTE IE 7, lol) не имеет такого поведения, все еще понимая ::before. Кроме того, в спецификации я не могу найти ничего, что указывало бы на то, что это предполагаемое поведение, и, поскольку это вызвало бы поломку любого селектора set , содержащего: ::future-legitimate-pseudoelement ... I Я склонен сказать, что это ошибка - и та, которая откусит наши задние части в будущем.


Однако, если вы хотите что-то только на уровне свойств (а не на уровне правил), Ziga выше имеет лучшее решение, добавив \9 (пробел является ключевым; НЕ копируйте вставленную строку как он использует):

/*property-level hacks:*/
/*Standards, Edge*/
prop:val;
/*lte ie 11*/
prop:val\9;
/*lte ie 8*/
prop:val \9;
/*lte ie 7*/
*prop:val;
/*lte ie 6*/
_prop:val;

/*other direction...*/
/*gte ie 8, NOT Edge*/
prop:val\0;

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

2 голосов
/ 06 декабря 2010

Выполнение чего-то подобного должно работать для вас.

<!--[if IE 8]> 
<div id="IE8">
<![endif]--> 

*Your content* 

<!--[if IE 8]> 
</div>
<![endif]--> 

Тогда ваш CSS может выглядеть так:

#IE8 div.something
{ 
    color: purple; 
}
0 голосов
/ 30 сентября 2016

Я искал хороший вариант для IE10 и ниже CSS-стилей (но он будет работать только для IE8), и мне пришла в голову эта идея:

<!--[if lt IE 10]><div class="column IE10-fix"><![endif]-->
<!--[if !lt IE 10]><!--><div class="column"><!--<![endif]-->

Я объявляю свой div или все, что вам нужно, с помощью дополнительного класса, это позволяет мне иметь дополнительный CSS в той же таблице стилей в очень удобочитаемой форме.

Это W3C-код, а не странный CSS-хак.

0 голосов
/ 29 октября 2015

Только для собственного браузера IE8:

.classname{
    *color: green; /* This is for IE8 Native browser alone */
}
0 голосов
/ 27 октября 2015

Это будет работать для версий Bellow IE8

.lt-ie9 #yourID {

ваш код CSS

}

0 голосов
/ 07 марта 2014

Существуют различные способы получить класс для элемента HTML, определяя, с какой версией IE вы боретесь: Modernizr , HTML 5 Boilerplate и т. Д. - или просто свернутьтвой собственный.Затем вы можете использовать этот класс (например, .lt-ie9) в обычном селекторе CSS, без необходимости взлома.Если вы хотите повлиять только на IE8, а не на предыдущие версии, верните старое значение обратно с помощью селектора .lt-ie8.

...