1. Diferentes interpretaciones de los intérpretes de caja #box{.
ancho:600px; //para ie6.0-
width:500px; //para ff+ie6.0
}
#caja{
ancho:600px!importante //para ff
ancho:600px; //para ff+ie6.0
ancho: 500px; //para ie6.0-
}
2. Para ocultar CSS en IE, use el subselector
html>body #box{ }
3, solo reconocido por IE
*html #cuadro{ }
4. Válido en ie/win pero oculto en ie/max, use barra invertida
5. Defina el estilo por separado para, por ejemplo,
6. Doble distancia generada por flotación, es decir.
#caja{
flotador: izquierda;
ancho: 100 px;
margin:0 0 0 100px; //En este caso, IE generará una distancia de 200px;
display:inline; //Ignorar elementos flotantes
}
Hablemos aquí en detalle sobre los dos elementos block e inline. Las características del elemento Block son: siempre comienza en una nueva línea y se pueden controlar la altura, el ancho, la altura de la línea y los márgenes (elementos de bloque); las características del elemento en línea son: y Otros elementos están en la misma línea,... no se pueden controlar (elementos en línea);
#caja{
display:block; //Puede simular elementos en línea como elementos de bloque
display:inline; //Logra el efecto de organizar en la misma línea
diplay:table; //para ff, simula el efecto de la tabla
}
7, solo para oprea
@media todo y (ancho mínimo: 0px){
#caja{ }
}
8. Problemas con IE y ancho y alto
IE no reconoce la definición de min-, pero de hecho trata el ancho y alto normales como si hubiera un min. Esto será un gran problema si solo usas ancho y alto,
Estos dos valores no cambiarán en los navegadores normales. Si solo usa ancho mínimo y alto mínimo, significa que el ancho y el alto no están configurados en absoluto en IE.
Por ejemplo, si desea establecer una imagen de fondo, este ancho es más importante. Para resolver este problema, puedes hacer esto:
#box{
ancho: 80px;
altura: 35 píxeles;
}
html>cuerpo #cuadro{
ancho: automático;
altura: automático;
ancho mínimo: 80px;
altura mínima: 35 px;
}
9. El ancho mínimo de la página,
min-width, es un comando CSS muy conveniente. Puede especificar que el ancho mínimo del elemento no puede ser menor que un cierto ancho, para garantizar que la composición tipográfica sea siempre correcta. Pero IE no reconoce esto y, de hecho, trata el ancho como el ancho mínimo. Para que este comando también esté disponible en IE, puede colocarlo debajo de la etiqueta <body> y luego especificar una clase para el div. El CSS está diseñado así:
#container{.
ancho mínimo: 600px;
ancho: expresión (document.body.clientWidth <600? "600px": "auto");
}
El primer ancho mínimo es normal; pero el ancho de la segunda línea usa Javascript, que sólo es reconocido por IE, lo que también hará que su documento HTML sea menos formal. En realidad, implementa el ancho mínimo mediante el juicio de Javascript.
También se puede utilizar el mismo método para lograr el ancho máximo para IE:
#recipiente
{
ancho mínimo: 600px;
ancho máximo: 1200px;
ancho:expresión(document.body.clientWidth < 600? "600px": document.body.clientWidth > 1200? "1200px" : "auto";
}
10, flotador claro
.hackbox{
display:table; //Muestra el objeto como una tabla a nivel de elemento de bloque
}
o
.hackbox{
claro: ambos;
}
O agregue: after (pseudoobjeto) para establecer el contenido que aparece después del objeto. Generalmente se usa junto con el contenido. IE no admite este pseudoobjeto y no es compatible con los navegadores de IE, por lo que no afecta a IE/. GANAR navegadores. -------Esto es lo más problemático...
#cuadro:después{
contenido: ".";
mostrar: bloquear;
altura: 0;
claro: ambos;
visibilidad: oculta;
}
11. El texto IE flotante DIV produce un error de 3 píxeles
El objeto de la izquierda flota y el de la derecha se coloca utilizando el margen izquierdo del parche exterior. El texto dentro del objeto de la derecha estará espaciado 3 píxeles desde la izquierda.
#caja{
flotador: izquierda;
ancho: 800 px;
}
#izquierda{
flotador: izquierda;
ancho: 50%;
}
#bien{
ancho: 50%;
}
*html #izquierda{
margin-right:-3px; //Esta oración es la clave
}
código HTML
12. Selector de atributos (esto no se puede considerar compatible, es un error al ocultar CSS)
p[id]{}
div[id]{}
está oculto para las versiones inferiores a IE6.0 e IE6.0.
Todavía hay una diferencia entre los selectores de atributos y los subselectores utilizados por FF y OPera. El alcance de los subselectores se reduce en forma. El alcance del dispositivo es relativamente grande. Por ejemplo, en p [id], todas las etiquetas p con id tienen el mismo estilo.