2010-05-07 2 views
9

Ich habe einige Stylesheets aus verschiedenen Quellen in meinem Webprojekt. Ich möchte sie harmonisieren. Einige Stile, die ich von der einen, einige von der anderen brauche. Gibt es ein Werkzeug oder eine Methode, um Stilkonflikte systematisch aufzulösen? Ich habe IE8 Entwickler-Tool versucht, und ja, es ist möglich, Konflikte auf der Ebene jedes Elements anzuzeigen. Aber ich habe viele Elemente, also wenn ich es elementweise mache, denke ich, dass das zu lange dauert. Theoretisch könnte es ein Werkzeug geben, das Konflikte von zwei CSS-Dateien zur Entwurfszeit zeigt?!? Ich denke, das würde mir viel Zeit sparen.Konfliktlösende Stile in CSS systematisch lösen

Antwort

7

Haben Sie diese Firefox-Erweiterung ausprobiert? https://addons.mozilla.org/en-US/firefox/addon/5392 Es erleichtert das Entfernen überflüssiger Stile.

Sonst würde ich wahrscheinlich alle Stile in eine Datei kopieren und versuchen, ähnliche Regeln zu gruppieren, und dann mit Dust-Me die unbenutzten entfernen.

+0

Staub mich hat mir sehr geholfen. Auch IE8 Dev-Tools. –

5

CSS hat keine Konflikte, es hat Kaskaden. Die Idee ist, dass Sie mehrere Regeln definieren können, die für die gleichen Elemente gelten und die Reihenfolge, in der Sie die Stile platzieren, eine Wichtigkeit widerspiegelt - d. H. Wenn sie zuletzt erscheint, überschreibt sie vorherige Regeln, bei denen Sie etwas als Konflikt beschreiben.

Sie sollten entweder ...

1) Entscheiden Sie, welche Stylesheet ist das wichtigste und legte es zweite

OR

2) neu schreiben Ihre Stile das Chaos

zu vermeiden Mark

OR

3) wichtige Regeln wie! wICHTIG

+3

-1 für die Erwähnung '! WICHTIG': P – Bart

+9

Weil Sie denken, dass Menschen nicht vertraut werden können, über diese Funktion zu wissen? Du willst es geheim halten? Während die Verwendung von '! WICHTIG' abgeraten wird, weil es im Konflikt mit dem Konzept der Kaskadierungsregeln steht, sprechen wir über den spezifischen Kontext, in dem versucht wird, viele Regeln aus mehreren Quellen zusammenzubringen und'! WICHTIG' ist definitiv ein Werkzeug, das Sie berücksichtigen müssen Lage. – Fenton

+1

Using! Wichtig normalerweise versteckt nur eine Sauerei unter dem Teppich sozusagen, und Sie am Ende mit mehr Durcheinander, die später nicht mehr unter den Teppich passen wird, aka fragen, warum css nicht eine sehr wichtige ... –

1

Wenn Sie die Site in FireFox anzeigen und die Firebug-Erweiterung verwenden, können Sie sich jedes Element Ihrer gerenderten Seite ansehen, und indem Sie die Registerkarte "CSS" in Firefox verwenden, können Sie die Kaskade von Stilregeln sehen werden auf dieses Element angewendet und aus welcher CSS-Quelldatei es stammt. Es zeigt Ihnen auch, welche Regeln außer Kraft gesetzt werden.

Dies ist hilfreich bei der Bestimmung, woher die jeweilige Regel kommt und was außer Kraft gesetzt wird.

Sie haben immer noch die Aufgabe, Ihre Stylesheets zu "rationalisieren", und es kann andere Tools geben, die dabei helfen können.

Verwandte Themen