Il y a quelques années, DIV+CSS a commencé à devenir progressivement la méthode préférée de conception de sites Web. À l'heure actuelle, DIV+CSS est devenu la norme en matière de conception de sites Web au cours des dernières années. années. . L'auteur est également un concepteur de sites Web qui préfère cette méthode. J'utilise div+css pour proposer des conceptions aux clients depuis trois ans. Alors, quels sont ses avantages par rapport à TABLE ? Parlons de quelques expériences et compréhensions personnelles, dans l’espoir d’être utiles aux collègues et au personnel concerné.
Le plus grand avantage de l'utilisation de DIV+CSS dans la conception Web est de normaliser le code Web, d'abandonner la méthode de mise en page de tableau obsolète et de réaliser la séparation entre le contenu, les performances et le comportement. Le code HTML est mieux structuré et plus facile à lire et à maintenir. et la taille du fichier de la page Web est également plus petite. Par exemple, après une récente reconstruction du site Web d'un client, la taille du fichier de la page Web était inférieure à la moitié de sa taille d'origine, ce qui occupait moins d'espace sur le site Web et le site Web s'ouvrait plus rapidement.
Les méthodes DIV+CSS et TABLE sont très différentes dans leur conception. Une planification minutieuse est nécessaire avant de commencer à concevoir une page Web, par exemple en nommant les éléments qui composent la page Web pour faciliter la définition du style en CSS. Les attributs publics sont mieux définis avec des noms de classe. . Les styles communs de l'ensemble du site Web peuvent être placés dans un fichier CSS distinct. Les attributs publics courants incluent : la largeur de la page Web, la couleur d'arrière-plan, l'image d'arrière-plan, la taille de police par défaut, la couleur, le style de lien, etc. Différents styles pour chaque page Web sont disponibles. le fichier CSS. Il est préférable de se concentrer sur un bloc et d'indiquer de quelle page Web ou partie de page Web il s'agit avant le bloc. Cela réduira non seulement la taille du fichier CSS, mais évitera également toute confusion et rendra la maintenance plus pratique. Il convient de mentionner que les styles ne doivent pas être intégrés dans le code d’une page Web pour séparer complètement le contenu et le style.
Pour faire du bon travail dans la conception Web DIV+CSS, trois points doivent être compris.
1. Attribut Float : DIV (couche) occupe une ligne entière par défaut pour les conceptions de mise en page courantes à deux ou plusieurs colonnes, vous devez être en mesure de définir correctement les attributs float et width pour obtenir l'effet. Une fois la mise en page multi-colonnes terminée, si un calque occupant la bannière est suivi, vous devez définir l'attribut clear pour effacer le calque flottant.
2. Mode boîte : le calque a des attributs tels que la largeur, la hauteur, la bordure, l'espacement intérieur et l'espacement extérieur. L'espace réel occupé par le calque est la somme des valeurs d'attribut ci-dessus. mise en page élégante. Belle mise en page Web.
3. Imbrication de couches : les concepteurs Web expérimentés savent tous qu'il n'est pas conseillé d'imbriquer trop de couches, généralement pas plus de 3 couches, cela entraînera un code complexe et redondant, des difficultés de maintenance et un fonctionnement lent. De plus, dans une disposition à plusieurs colonnes, le flottement de couche peut être utilisé et il n'est pas nécessaire de configurer une couche IE globale pour l'intégration.
Mentionnez séparément le sujet de la compatibilité des navigateurs. Par rapport à la disposition TABLE, DIV+CSS est plus sujet aux problèmes d'incompatibilité avec plusieurs navigateurs. La raison principale est que différents navigateurs ont des valeurs par défaut différentes pour les normes Web. Le courant dominant en Chine est IE, Firefox et Chrome étant moins couramment utilisés. En termes de tests de compatibilité, vous devez d'abord vous assurer qu'aucun problème ne survient dans plusieurs versions d'IE. Voici quelques méthodes et techniques conçues pour vous aider à trouver des solutions à des problèmes spécifiques. problèmes sur le site.
Résumé : DIV+CSS présente de nombreux avantages par rapport à TABLE. Les concepteurs Web devraient abandonner la méthode TABLE dès que possible, ce qui sera plus propice à l'apprentissage approfondi des connaissances DIV+CSS. Il n'est pas difficile d'apprendre et d'utiliser la méthode de conception Web DIV+CSS. Tant que vous comprenez quelques connaissances de base et effectuez quelques cas supplémentaires, vous la comprendrez et la maîtriserez progressivement.
Cet article a été publié par [Hippie], le webmaster de http://www.swjns.com . Veuillez conserver l'URL pour la réimpression.
Merci à hbjsp pour votre contribution