Producción de páginas web: resumen de 10 errores comunes de DIV+CSS
Autor:Eve Cole
Fecha de actualización:2009-06-12 17:53:00
1. Compruebe si hay errores ortográficos en los elementos HTML y si se olvidó la etiqueta de cierre.
Incluso los usuarios experimentados a menudo se equivocan al anidar divs. Puede utilizar la función de verificación de Dreamweaver para comprobar si hay errores.
2. Compruebe si el CSS es correcto.
Compruebe si hay errores de ortografía, } olvidado al final, etc. Puede utilizar CleanCSS para comprobar CSS en busca de errores ortográficos. CleanCSS es una herramienta para reducir el peso de CSS, pero también puede comprobar si hay errores ortográficos.
3. Determinar dónde ocurrió el error.
Si el error afecta el diseño general, puede eliminar los bloques div uno por uno hasta que la pantalla vuelva a la normalidad después de eliminar un bloque div determinado y pueda determinar dónde ocurrió el error.
4. Utilice el atributo de borde para determinar las características de diseño del elemento de error.
El uso del diseño de atributos flotantes puede provocar errores si no se tiene cuidado. En este momento, agregue el atributo de borde al elemento para determinar el límite del elemento y se revelará la causa del error.
5. El elemento principal de un elemento flotante no puede especificar el atributo claro.
En MacIE, si utiliza el atributo clear en el elemento principal de un elemento flotante, el diseño de los elementos flotantes circundantes será caótico. Este es un error famoso de MacIE. Si no lo sabe, tomará desvíos.
6. El elemento flotante debe especificar el atributo de ancho.
Muchos navegadores tienen errores al mostrar elementos flotantes con un ancho no especificado. Entonces, independientemente del contenido del elemento flotante, se debe especificar el atributo de ancho.
Además, intente utilizar em en lugar de px como unidad al especificar elementos.
7. Los elementos flotantes no pueden especificar atributos como margen y relleno.
IE tiene un error al mostrar elementos flotantes con margen y relleno especificados. Por lo tanto, no especifique atributos de margen y relleno en elementos flotantes (puede anidar un div dentro del elemento flotante para establecer el margen y el relleno). También puedes utilizar trucos para especificar valores extraordinarios para IE.
8. La suma de los anchos de los elementos flotantes debe ser inferior al 100%.
Si la suma de los anchos de los elementos flotantes es exactamente 100%, algunos navegadores antiguos no la mostrarán correctamente. Por lo tanto, asegúrese de que la suma de los anchos sea inferior al 99%.
9. ¿Has restablecido el estilo predeterminado?
Algunos atributos, como margen, relleno, etc., serán interpretados de forma diferente por distintos navegadores. Por lo tanto, es mejor establecer todos los márgenes y el relleno en 0, el estilo de lista en ninguno, etc. antes del desarrollo.
10. ¿Has olvidado escribir una DTD?
Si los resultados de visualización de diferentes navegadores siguen siendo diferentes sin importar cómo los ajuste, puede verificar si olvidó escribir la siguiente línea de DTD al comienzo de la página:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transicional//EN" " http://www.w3.org/TR/html4/loose.dtd ">