css - para - if ie 11 html
¿Hay algún IE8 solo css hack? (11)
Para Internet Explorer 8 (IE8) me gustaría usar el siguiente CSS:
color : green;
Me gustaría aplicar un hack que solo afecta a IE8, no a IE9, IE6 y 7.
¿No puede usar el truco que ya ha mostrado y luego usar un truco IE7 o inferior para anularlo?
Estaba buscando una buena opción para IE10 y por debajo del estilo CSS (pero también funcionaría para IE8) y se me ocurrió esta idea:
<!--[if lt IE 10]><div class="column IE10-fix"><![endif]-->
<!--[if !lt IE 10]><!--><div class="column"><!--<![endif]-->
Declaro mi div o lo que quieras con una clase extra, esto me permite tener CSS extra en la misma hoja de estilo de una manera muy legible.
Es válido para W3C y no es un hack CSS raro.
Esto funcionará para Bellow IE8 Versiones
.lt-ie9 # su ID {
tu código css
}
Hacer algo como esto debería funcionar para ti.
<!--[if IE 8]>
<div id="IE8">
<![endif]-->
*Your content*
<!--[if IE 8]>
</div>
<![endif]-->
Entonces tu CSS puede verse así:
#IE8 div.something
{
color: purple;
}
Hay varias formas de incluir una clase en el elemento HTML, identificando con qué versión de IE está compitiendo: Modernizr , el HTML 5 Boilerplate , etc. Luego puede usar esa clase (por ejemplo, .lt-ie9) en un selector de CSS normal, no se necesita hackear. Si solo desea afectar a IE8 y no a versiones anteriores, vuelva a poner el valor anterior con un selector .lt-ie8.
Por lo tanto, una pregunta reciente me hizo advertir que un selector de trucos para excluir solo IE 8.
.selector, #excludeIE8::before {} hará que IE 8 .selector, #excludeIE8::before {} todo el conjunto de selector, mientras que 5-7 y 9-11 lo leerán bien. Cualquiera de los :: selectores ( ::first-line, ::before, ::first-letter, ::selection ) funcionará, simplemente elegí ::before así que la línea se lee con precisión. Tenga en cuenta que el objetivo del selector falso ::before es ser falso, así que asegúrese de cambiarlo a otra cosa si realmente tiene un elemento con el ID excludeIE8
Curiosamente, en los navegadores modernos (FF 45-52, GC 49-57, Edge 25/13) un mal selector :: come todo el conjunto de selector ( demostración de dabblet ). Parece que la última versión de Safari para Windows (y LTE IE 7, lol) no tiene este comportamiento al mismo tiempo que entiende ::before . Además, no puedo encontrar nada en la especificación que indique que se trata de un comportamiento intencionado, y dado que causaría una rotura en cualquier conjunto selector que contenga: ::future-legitimate-pseudoelement ... Me inclino a decir que esto es un Insecto y uno que mordisqueará nuestras crías en el futuro.
Sin embargo, si solo desea algo en el nivel de propiedad (en lugar del nivel de la regla), Ziga anterior tuvo la mejor solución agregando /9 (el espacio es clave; NO copie la basura en línea, ya que usa un nbsp):
/*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;
Nota al margen, me siento como un nigromante sucio, pero quería un lugar donde documentar el truco del conjunto exclusivo de exclusión de IE8 que encontré hoy, y este parece ser el lugar más apropiado.
Si es necesario, pequeños cambios en el uso de CSS / 9 se dirige a IE8 e inferior (IE6, IE7, IE8)
.element {
color:green /9;
}
La mejor manera es usar comentarios condicionales en HTML, como este:
<!--[if IE 8]>
<style>...</style>
<![endif]-->
Solo para el navegador nativo IE8:
.classname{
*color: green; /* This is for IE8 Native browser alone */
}
Usa comentarios condicionales en HTML, como este:
<!--[if IE 8]>
<style>...</style>
<![endif]-->
Consulte aquí: http://www.quirksmode.org/css/condcom.html
Puede probar las versiones de IE de manera confiable y también asegurarse de que otros navegadores no se confundirán.
Usa consultas de medios para separar cada navegador:
/* 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 */
}
Referencias
Utilice /0 .
color: green/0;
Sin embargo, sí recomiendo comentarios condicionales, ya que te gustaría excluir también IE9 y aún es impredecible si este hack afectará a IE9 o no.
En cualquier caso, nunca he tenido la necesidad de un hack específico para IE8. ¿Qué es, el problema específico de IE8 que te gustaría resolver? ¿Se está mostrando en modo estándar de IE8 de todos modos? Su renderizador es bastante bueno.