Résumé des solutions aux problèmes CSS courants_Échange d'expériences

1. Vérifiez s'il y a des fautes d'orthographe dans les éléments HTML et si la balise de fermeture est oubliée
Même les vétérans font souvent des erreurs dans la relation d'imbrication des divs. Vous pouvez utiliser la fonction de vérification de Dreamweaver pour rechercher les erreurs.

2. Vérifiez si le CSS est correct
Vérifiez s'il y a des fautes d'orthographe, si vous avez oublié la terminaison }, etc. Vous pouvez utiliser CleanCSS pour vérifier les CSS pour les fautes d'orthographe. CleanCSS est un outil permettant de réduire le poids du CSS, mais il peut également vérifier les fautes d'orthographe.

3. Déterminez l'emplacement où l'erreur s'est produite
Si l'erreur affecte la disposition globale, vous pouvez supprimer les blocs div un par un jusqu'à ce que l'affichage revienne à la normale après la suppression d'un bloc div, vous pouvez alors déterminer l'endroit où l'erreur s'est produite.

4. Utilisez l'attribut border pour déterminer les caractéristiques de mise en page de l'élément d'erreur
L'utilisation de l'attribut float pour la mise en page provoquera des erreurs si vous ne faites pas attention. À ce stade, ajoutez l'attribut border à l'élément pour déterminer la limite de l'élément et la cause de l'erreur sera révélée.

5. L'élément parent d'un élément float ne peut pas spécifier l'attribut clear.
Si vous utilisez l'attribut clear sur l'élément parent d'un élément float sous MacIE, la disposition des éléments float environnants sera. confus. C'est un bug célèbre de MacIE Si vous ne le savez pas, vous ferez des détours.

6. Les éléments float doivent spécifier l'attribut width
De nombreux navigateurs ont des bugs lors de l'affichage des éléments float sans largeur spécifiée. Ainsi, quel que soit le contenu de l'élément float, l'attribut width doit être spécifié pour celui-ci.
De plus, lorsque vous spécifiez des éléments, essayez d'utiliser em au lieu de px comme unité.

7. Les éléments flottants ne peuvent pas spécifier des attributs tels que la marge et le remplissage.
IE a un bug lors de l'affichage des éléments flottants avec une marge et un remplissage spécifiés. Par conséquent, ne spécifiez pas les attributs margin et padding sur les éléments float (vous pouvez imbriquer un div à l'intérieur de l'élément float pour définir la marge et le padding). Vous pouvez également utiliser des hacks pour spécifier des valeurs spéciales pour IE.

8. La somme des largeurs des éléments float doit être inférieure à 100 %
Si la somme des largeurs des éléments float est exactement de 100 %, certains anciens navigateurs ne s'afficheront pas correctement. Par conséquent, veillez à ce que la somme des largeurs soit inférieure à 99 %.

9. Avez-vous réinitialisé le style par défaut ?
Certains attributs tels que la marge, le remplissage, etc. seront interprétés différemment selon les navigateurs. Par conséquent, il est préférable de définir toutes les marges et tous les remplissages sur 0, le style de liste sur aucun, etc. avant le développement.

10. Avez-vous oublié d'écrire la DTD ?
Si les résultats d'affichage sont toujours différents quelle que soit la façon dont vous configurez les différents navigateurs, vous pouvez alors vérifier si vous avez oublié d'écrire la ligne DTD suivante au début de la page :
nbsp;HTML PUBLIC “-//W3C//DTD HTML 4.01 Transitional//EN” “http://www.w3.org/TR/html4/loose.dtd”>