Je recherche des stratégies de personnes pour faire face à l'inévitable nécessaire de modifier ou d'adapter une classe CSS pour accueillir de nouveaux éléments HTML. Je me trouve dans cette situation assez souvent, alors j'espère que d'autres personnes partagent ma douleur et peuvent vous conseiller ici.
Imaginez que vous ayez une table de produits avec le Nice Nom de la classe sémantique Cela soulève immédiatement une question importante: quoi d'appeler la nouvelle table du personnel . Les seules options que je peux penser sont:
Quel est le meilleur plan d'action à prendre ici?
n.b. Je suis sûr que ce problème est facilement résolu à l'aide de cadres comme moins (je ne l'ai pas utilisé personnellement), mais cette solution me frappe davantage comme une "couverture" qu'un remède réel. Produits . Ceci est coiffé de manière appropriée dans votre feuille de style. Quelques mois en bas de la ligne, votre patron vous demande de créer une liste de personnel sur le site ", a déclaré exactement la même chose que la liste des produits".
Produits aussi. C'est la solution la plus rapide mais ruine la sémantique. La dénomination a peu de sens surtout aux futurs développeurs.
.products {...} devient .products, .staff {...} et et et .Produits Thlead th.Number {Font-Poids: Bold} devient .Products THead the th.number, .staff thead th.number {Font-Poids: Bold} , etc. Solution laide qui ne sera plus compliquée que le temps passe.
8 Réponses :
Que diriez-vous d'option 4:
Faire une copie "Produits" comme "Personnel" et continuer à y travailler séparément au fil du temps.
Ah, c'était la quatrième option que je ne pouvais pas me rappeler! Ce n'est pas une solution que j'aime particulièrement. Il enfreint les principes secs et, encore une fois, annule les avantages effectués en séparant le contenu et le style. Et pourtant en ce moment c'est la solution la plus attrayante ...
C'est un peu plus d'avenir.
Si vous deviez mettre votre style de la table en quelques mots, que serait-il? J'essaie d'utiliser cela pour nommer des styles que je suis gunna utiliser dans plus d'un endroit. Ensuite, j'ai une idée de ce que cela ressemblera si j'utilise la classe.
Exemple:
.table-rayé {}
Si vous restant votre table dans le futur et que ce n'est plus rayé, vous êtes coincé avec le nom de la classe .table-rayé ne ressemble en aucun cas aux propriétés visuelles de la table.
Pour être honnête, c'est un très grand débat de ce que j'ai vu. J'ai lu les choses des deux côtés de l'argument. Une bonne lecture pour rendre votre CSS modulaire est la suivante: smacsss.com . Même si vous n'êtes pas d'accord avec cela, il y a de bons points et astuces.
C'est l'une des choses que je n'aime vraiment pas chez CSS. Avec toutes les langues puissantes à notre disposition, celle-ci semble simplement frappée de la goûte pour gérer des scénarios très courants comme le vôtre. Je suis trop lutte avec cela tout le temps et finissez par la copie de toutes les classes de qualité liées au produit à mon nouveau ou en ajoutant mon nouveau sur les .product. Ils pourraient être retirés plus tard.
J'ai aussi besoin d'étudier sur les pré-processeurs, car ce que j'aimerais aimer faire est quelque chose d'oop-y - définir la classe B 'de base' qui a à la fois .Produit et .Mynewone hériter de et aller de là.
mais # 3 est votre meilleur pari imo.
Je vais avec première option car si tout est identique et là juste un changement de contenu. Donc, vaut mieux utiliser les produits précédents CLASSE Classe pour le personnel et votre peut définir séparément votre panneau de membre du personnel à l'aide d'un commentaire <- plan du personnel -> à l'intérieur du Page HTML.
hmm ...
Fondamentalement, la racine du problème est que votre pensée originale de la création de la première classe de style ( Le cadre CORRE CSS n'a pas le moyen de dire «rendre mon nouveau style ( Mais je pense que le moins de cadre vous donne la possibilité de définir une classe ( Le moins de cadre n'est pas une «dissimulation» autant qu'une extension des capacités de CSS. .products ) était trop étroitement nommée. Il n'est pas toujours possible de savoir que vous devrez réutiliser une partie importante d'une définition de CSS à un point ultérieur, mais basé sur votre question, il semble que vous soyez dans cette ligne d'activité.
.staff ) soit identique à un autre style ( .products ) avec ces substitutions '
.Cooltable ) avec toutes les propriétés et réutiliser ces propriétés dans plusieurs autres défenseurs de classe (. produits et .Staff ) rapidement.
J'irais avec la première option, d'avoir la classe De cette façon, je ne passerai pas de styles en double (même des aspects futurs, lorsque le code / styles pourrait changer beaucoup), et tout styles spécifiques pour les produits peut être fait comme celui-ci par nouvelle classe (ou par une autre façon d'utiliser Classe des parents dans des styles pour donner plus de spécificité des styles).
Oui, mais toujours oui, si possible de modifier le balisage à l'aise du produit à un autre mot, je le ferais .. mais pas en tant que telle exigence majeure dans ces cas ... Produits avec ce bloc ... ou peut-être comme Classe = "Personnel des produits"
Produit Le mot de classe n'a pas beaucoup de sens ici, mais même pour les futurs développeurs, cela signifie toujours vous utilisez des styles de classe de personnel , pas liées logique ...
Introduction Nom de la classe individuelle pour un nouveau type de contenu serait probablement probablement la plus droite la solution. Mais malheureusement, la syntaxe CSS actuelle est loin d'être parfaite et nous oblige donc à être trop verbeuse dans notre CSS en répertoriant des sélecteurs complètes un par un.
Ainsi, dans la pratique, la plupart la solution de maintenabilité est généralement d'essayer de trouver un nom commun pour différentes choses de style identique.
Il y a essentiellement deux écoles de pensée ici.
1) style qui suit le balisage 2) Marquage qui suit le style.
Vous devez déterminer lequel vous voulez faire et essayer de vous coller à l'un ou à l'autre. Si vous mélangez trop, c'est inutile et vous avez juste un imbécile en désordre.
Dans la première, vous avez un marquage défini qui ne change pas. Vous déconnectez un style pour le faire paraître comme vous le souhaitez. C'est dans la veine du jardin Zen CSS. Cela nécessite que votre balisage soit extrêmement sémantique. L'inconvénient est que vous avez souvent beaucoup de styles en double, car il n'est pas toujours possible de bloquer proprement lors de l'utilisation de cette méthode.
Dans la seconde, vous créez beaucoup de styles communs, puis adaptez votre balisage pour s'adapter aux styles. Par exemple, vous pourriez avoir une classe de "flotteur", "Thinforder", "Bold" puis appliquer ces styles à votre balisage. L'inconvénient est que si votre style doit changer, vous devez modifier le code HTML (ou que le gras ne soit pas audacieux, ni d'autres). Le positif est que votre CSS est beaucoup plus propre et maintenu.
Ça craint, mais vous devez faire des compromis.
Je suis définitivement un avocat de style qui suit le balisage. J'écris tout mon HTML avant que je touche des CSS. Donc, dans cet esprit, je pense que je suis plus enclin à dupliquer les styles. Et pourtant je ne suis pas d'accord avec des personnes qui disent jamais d'utiliser des noms de classe de présentation. Parfois, la présentation d'un élément est la seule cause de lui donner un nom de classe en premier lieu.