Bueno, permítanme comenzar con algunos comentarios irrelevantes. Mi trabajo reciente me ha brindado muchas oportunidades prácticas y también me ha brindado muchos beneficios. Al charlar en el grupo, también mencioné que el mejor proceso de aprendizaje es teoría-práctica-luego teoría-y luego práctica. . . un proceso cíclico. La teoría mencionada aquí es un concepto relativamente amplio, que incluye la teoría del libro y el resumen de la práctica. Sólo la teoría sin práctica a menudo resulta en altivez y bajo poder, pensar bien pero hacerlo mal, practicar ciegamente sin aprender y resumir a través de la teoría parecerá estar ocupado, pero al final tendrás las manos vacías.
En la práctica reciente, siento cada vez más que será más problemático cuando el elemento li contenga un elemento img y debo prestarle atención. Por supuesto, el problema sigue ocurriendo en IE como siempre. El siguiente es un ejemplo:
HTML
<ul>
<li><a href="#"><img src="img/temp.jpg" alt="" /></a></li>
<li><a href="#"><img src="img/temp.jpg" alt="" /></a></li>
<li><a href="#"><img src="img/temp.jpg" alt="" /></a></li>
<li><a href="#"><img src="img/temp.jpg" alt="" /></a></li>
</ul>
CSS
ul{
ancho: 280px;
}
ulli{
mostrar:bloquear;
altura: 57 píxeles;
ancho: 277 px;
}
El tamaño de temp.jpg es 277×57
Comportamiento normal en Firefox:
Rendimiento anormal bajo IE6:
Es obvio que en IE, la altura de rendimiento de li no es los 57 px que configuramos, sino más alto. Esto se debe a que hay 5 px adicionales de espacio en blanco debajo de img.