Afin de gérer le CSS plus efficacement, Sofish explique ci-dessous les concepts et les perspectives du « CSS modulaire ». J'espère que cela vous sera utile.
Au début de mon apprentissage du CSS, je suis entré en contact avec le concept de « CSS modulaire », mais je ne l'ai jamais bien compris. En parlant de cela, la raison est très simple : comme presque tout le code est destiné à la conception du blog, et pour une structure aussi petite qu'un blog, il n'est pas du tout nécessaire d'avoir beaucoup de fichiers CSS, car la quantité de code lui-même est petit et il n'y a pas beaucoup de modèles de page utilisant différentes expressions, moins c'est plus pratique à gérer. Par conséquent, ma compréhension du CSS modulaire est très déroutante, ce qui m'amène directement à penser que la méthode de division suivante est très raisonnable :
reset.css // Réinitialise le style par défaut du navigateur.
layout.css //Gérer la mise en page de la page
typeset.css // Disposition des graphiques et du texte et
color.css // Gestion unifiée de la correspondance des couleurs
print.css //Style d'effet d'impression
ie.css // Il n'est pas vrai de séparer les hacks pour IE. J'ai récemment travaillé et suis entré en contact avec le site Web de l'entreprise. Le leader a dû écrire ses propres spécifications d'écriture CSS, ainsi que des spécifications HTML unifiées. chaînes/pages/magasins. Ce n’est qu’à ce moment-là que j’ai réalisé que cette division était encore trop idéaliste. Personnellement, je pense que la méthode de division suivante peut être utilisée. Écrivons-le d'abord, puis comparons ces deux méthodes de division pour trouver une méthode de division modulaire CSS appropriée qui résout mieux la gestion des fichiers CSS :
reset.css
header.css // Tous les styles de l'en-tête
conteneur.css // Style de la zone médiane sauf en-tête/bas
footer.css // Style du bas
imprimer.css
c'est à dire.css
Nous pouvons voir qu'il existe trois fichiers CSS différents. La première méthode de division est une bonne approche, mais elle est plus délicate à gérer. Bien qu'elle soit « modulaire », le style du contenu affiché est séparé. Cependant, comme il est impossible pour tout le monde de comprendre à 100 % le contenu de chaque fichier CSS, cela peut entraîner les problèmes suivants :
1. Les problèmes d'efficacité et l'objectif ultime résident dans le contenu du site Web, s'il s'agit du contenu d'une certaine zone. est modifié, combien de fois cela peut-il prendre ? Changer tous les CSS. En conséquence, ce qui était à l’origine une simple modification a commencé à devenir compliqué. De plus, si plusieurs modifications sont apportées, nous pouvons négliger quelque chose et nécessiter un débogage supplémentaire. Cela retardera non seulement la réalisation de l'objectif final, mais entraînera également un problème d'efficacité.
2. Appelez le moins de fichiers CSS possible. Dans la plupart des cas, un site Web est divisé en tête, milieu et bas. Et, généralement, lors de la création de nouvelles chaînes/pages, etc., la tête et le bas ne seront pas modifiés. seule la partie médiane est modifiée. De cette façon, tous les fichiers CSS doivent être appelés, car la modularité du HTML et du CSS n'est pas cohérente. Cela entraînera une pression accrue sur le serveur. C'est un aspect. Un autre aspect est que si certains éléments de la nouvelle page entrent en conflit avec d'autres pages, nous devrons peut-être écrire beaucoup de code sur la sélection des priorités, augmentant ainsi la quantité de code. Rien de tout cela n’est ce que nous voulons. C'est pourquoi header.css et footer.css doivent être séparés.
3. Problèmes liés à la coopération multi-personnes Si nous sommes plusieurs à travailler, la division du travail peut être que quelqu'un termine la navigation en tête, quelqu'un complète la barre de recherche en bas et quelqu'un termine la construction du nouveau. page au milieu. De cette façon, chacun modifie plusieurs fichiers en même temps, et les éléments modifiés sont différents. Si vous souhaitez effectuer une mise à jour vers le serveur, vous devez d'abord comparer puis mettre à jour. (Bien sûr, il existe désormais des logiciels tels que la gestion des versions. Cependant, si vous travaillez en même temps, la version est également un problème. Il faut croire que peut-être que les mises à jour ne la modifieront jamais.)
Conclusion :
Bien entendu, la méthode de division ci-dessus n’est qu’un modèle simple. L'architecture des différents sites Web peut nécessiter une classification plus détaillée. Une chose qui doit être rappelée ici est qu'avec le CSS modulaire, nous devons toujours être clairs sur le fait que nous sommes là pour faciliter la gestion, la modification et la collaboration entre plusieurs personnes, plutôt que pour une simple division. Si j'ai des suggestions, je pense que la modularité du CSS devrait être cohérente avec la modularité du HTML. Le consensus ici est que qu'il s'agisse de la division des fichiers ou de la division du contenu CSS, elle est cohérente avec la modularité du HTML. Cela sera plus bénéfique pour notre travail.
Et qu'en pensez-vous ?