Al realizar la composición tipográfica DIV + CSS en la página, es absolutamente común encontrar el problema del exceso de espacio en blanco debajo del elemento de imagen img en IE6 (por supuesto, a veces en Firefox La solución a este problema también es "reproducirlo"). ear", se deben utilizar diferentes soluciones según los motivos. Aquí resumimos directamente los métodos comunes para resolver el ERROR de espacios excesivos debajo del diseño de la imagen para su referencia.
1. Convierta la imagen en un objeto a nivel de bloque
configurando img en "display:block;". En este ejemplo, agregue un conjunto de código CSS: "#sub img {display:block;}".
2. También se puede resolver configurar la alineación vertical de la imagen,
es decir, configurar el atributo de alineación vertical de la imagen en "arriba, texto arriba, abajo, texto abajo". Por ejemplo, en este ejemplo, agregue un conjunto de código CSS: "#sub img {vertical-align:top;}".
3. Establezca el tamaño del texto del objeto principal en 0px,
es decir, agregue una línea en #sub: "font-size:0;" para resolver el problema. Pero esto también causó un nuevo problema: el texto en el objeto principal no se puede mostrar. Incluso si la parte de texto está encerrada por un subobjeto, aún se puede mostrar configurando el tamaño del texto del subobjeto, pero aparecerá un mensaje de error indicando que el texto es demasiado pequeño durante la validación de CSS.
4. Cambie las propiedades del objeto principal.
Si el ancho y el alto del objeto principal son fijos y el tamaño de la imagen depende del objeto principal, puede configurar "overflow:hidden;" para resolver el problema. Por ejemplo, en este ejemplo, puede agregar el siguiente código a #sub: "ancho:88px;alto:31px;overflow:hidden;".
5. Para configurar el atributo flotante de la imagen
, agregue una línea de código CSS en este ejemplo: "#sub img {float:left;}". Si desea lograr una disposición mixta de imágenes y texto, este método es una buena opción.
6. Cancele el espacio entre la etiqueta de imagen y la última etiqueta de cierre de su objeto principal.
Cabe enfatizar que este método puede causar problemas en el desarrollo real, porque para que el código sea más semántico y claro al escribir código, es inevitable proporcionar una visualización de sangría del código a través del IDE, lo que inevitablemente hará que las etiquetas y otras etiquetas Visualización de salto de línea, como el comando "Aplicar formato de origen" de DW. Por lo tanto, este método puede ayudarnos a comprender una situación en la que ocurre un ERROR. La solución específica debe ser resuelta por todos.