11
votes

Résoudre systématiquement des styles contradictoires dans CSS

J'ai des feuilles de style de différentes sources dans mon projet Web. Je veux les harmoniser. Quelques styles dont j'ai besoin de celui de l'autre. Existe-t-il un outil ou une méthode comment résoudre systématiquement les conflits de style? J'ai essayé l'outil de développeur IE8 et oui, il est possible de visualiser des conflits au niveau de chaque élément. Mais j'ai beaucoup d'elemens, donc si je fais un élément par élément, je pense que cela prend trop de temps. Théoriquement, il pourrait y avoir un outil qui montre des conflits de deux fichiers CSS au moment de la conception?!? Je pense que cela me sauverait beaucoup de temps.


0 commentaires

4 Réponses :


5
votes

CSS n'a pas de conflit, il a des cascades. L'idée est que vous pouvez définir plusieurs règles qui s'appliquent aux mêmes éléments et à l'ordre dans lequel vous placez les styles reflète une importance - c'est-à-dire si elle apparaît en dernier, elle remplacera les règles précédentes où il y a quelque chose que vous décrivez comme un conflit. < / p>

Vous devriez soit ...

1) Décidez quelle feuille de style est la plus importante et la pose seconde

ou

2) Réécrivez vos styles pour éviter le désordre

ou

3) marque des règles importantes comme! important


2 commentaires

Parce que vous pensez que les gens ne peuvent pas faire confiance à cette fonctionnalité? Vous voulez qu'il soit gardé secret? Tout en utilisant ! Important est découragé car il est en conflit avec le concept de règles en cascade, nous parlons du contexte spécifique d'essayer de réunir de nombreuses règles de plusieurs sources et ! Important est définitivement un outil que vous devez envisager dans cette situation.


En utilisant! IMPORTANT Cache généralement un gâchis sous le tapis pour ainsi dire, et vous vous retrouvez avec plus de mess qui ne correspondra plus sous le tapis plus tard, AKA demande pourquoi CSS n'a pas de! Trèsimportante ...



7
votes

Avez-vous essayé cette extension Firefox? Dust Me Selector http://www.brothercake.com/dustmeselectors/ Cela facilite la suppression de styles redondants beaucoup plus facile.

Sinon, je voudrais probablement apparaître tous les styles dans un seul fichier, essayant de regrouper des règles similaires, puis utilisez la poussière-moi pour éliminer les personnes inutilisées.


2 commentaires

la poussière m'a aidé beaucoup. Aussi IE8 Dev Outils.


Le lien ne fonctionne plus. Quel est le nom de l'add-on que vous faisiez référence?



1
votes

Si vous affichez le site de Firefox et utilisez l'extension Firebug, vous pouvez ensuite consulter chaque élément de votre page rendue et en utilisant l'onglet "CSS" de Firefox, vous pouvez voir la cascade des règles de style qui sont Être appliqué à cet élément et de quel fichier source CSS provient chacun de. Cela vous montrera quelles règles sont remplacées, aussi.

Ceci est utile pour déterminer uniquement lorsque chaque règne provient de chaque règne et de ce qui est remplacé.

Vous avez toujours la tâche de "rationaliser" vos feuilles de style, et il peut y avoir d'autres outils pouvant aider à cela.


0 commentaires

0
votes

J'ai jeté un script rapide qui peut être utile pour détecter le chevauchement de règles CSS à partir de sources multiples: HTTPS : //github.com/mgsloan/css-overlap

Comme écrit, cela ne fonctionne que pour les feuilles de style référencées par URL, mais peut être facilement adaptée pour gérer les feuilles de style en ligne. Il utilise deux regexes pour diviser les feuilles de style en deux séries, puis scanne chaque nœud DOM de votre page à la recherche de cas où certaines règles des deux ensembles de feuilles de style correspondent.


0 commentaires