Ich möchte einen vorhandenen CSS-Stil auf alle Labels einer Seite anwenden. Wie?

7

Hinweis: Dies ist anders als die ältere Frage Wie kann ich CSS auf alle Schaltflächen anwenden, die auf dieser Seite vorhanden sind? , weil dies ein bereits vorhandener Stil ist. Wenn also ein Stil, den wir "standard_label_style" nennen, bereits in einer CSS-Datei vorhanden ist, kann ich sagen, dass alle Beschriftungen auf dieser Seite diesen Stil haben sollten:

%Vor%

zu jedem einzelnen? Und ja, ich weiß, dass ich die Stile ex-post-facto mit einem Snippet von jQuery oder JavaScript-Code anwenden könnte. Ich versuche nur zu lernen, wie ich es mit CSS machen soll.

Nachverfolgung

Ich habe mehrere Kommentare bekommen, die sagen, benutze einfach die Syntax wie .standard_label_style, label ... Leider macht das nichts, was ich will. Das würde mir erlauben, zusätzliche Regeln für die Klasse standard_label_style sowie Regeln für Labels auf dieser Seite anzuwenden, aber ich würde nicht zulassen, dass ich diesen Stil auf alle Labels auf dieser Seite anwenden würde. Um ein Beispiel dafür zu sehen, hier ist ein Stylesheet und HTML zu demonstrieren. Das Label ohne Klasse wird immer noch nicht rot erscheinen, aber das hoffe ich. Ich möchte eine vorhandene Klasse auf alle Beschriftungen auf der Seite anwenden, nicht nur auf die mit der Klasse und ohne neuen Stil auf dieser Seite hinzuzufügen, der vorhandene Stil sollte der einzige Stil sein.

included.css:

%Vor%

test.html:

%Vor%     
John Munsch 27.05.2011, 14:48
quelle

7 Antworten

12

CSS funktioniert nicht wirklich so.

Sie können einen Stil direkt auf alle Labels anwenden:

%Vor%

oder wenden Sie eine Klasse auf alle Labels an

%Vor%

Sie können auch mehrere Selektoren haben, sodass Sie Ihren aktuellen Stil verbessern können, um

zu sein %Vor%

Was Sie in Standard-CSS nicht tun können, ist etwas wie

%Vor%

Die gute Nachricht ist, dass es eine Reihe von serverseitigen Bibliotheken gibt, die CSS weniger lutschen lassen und Ihnen genau das ermöglichen, siehe zum Beispiel dotLess , wenn Sie .NET verwenden, das verschachtelte Regeln und ein grundlegendes Inheratermodell bietet.

    
fearofawhackplanet 27.05.2011, 14:56
quelle
8

Um einen Stil auf jedes Etikett auf der Seite anzuwenden, verwenden Sie dieses CSS:

%Vor%

Wenn Sie bereits einen CSS-Stil (z. B. "standard_label_style") im CSS haben, können Sie diesen auf jedes Label anwenden:

%Vor%

Dies wirkt sich auf jedes Etikett auf der Website aus, also verwenden Sie es mit Vorsicht!

    
whostolemyhat 27.05.2011 14:51
quelle
4

In Ihrer CSS-Datei können Sie nicht einfach

einfügen %Vor%     
AllisonC 27.05.2011 14:51
quelle
3
%Vor%     
Pedro Correia 27.05.2011 14:51
quelle
3

Ich bin mir nicht sicher, ob Sie ... eine mögliche Problemumgehung (fühlt sich ein bisschen hackisch) daran haben, den Stil an Ihr body-Tag anzuhängen, dann ändern Sie die css wie folgt:

%Vor%     
Ian Jacobs 27.05.2011 14:53
quelle
2

Einer der am wenigsten genutzten CSS-Tricks aller Zeiten: Gib deinen Körpern eine ID oder Klasse!

HTML:

%Vor%

CSS:

%Vor%

nimmt die Stile, während

HTML:

%Vor%

Wird nicht.

    
Chris Sobolewski 27.05.2011 14:56
quelle
0

Sie haben es hier mit der CSS-Priorität zu tun. Deklarationen, die "vage" sind (Body-Tag, Klassen) werden vor Deklarationen angewendet, die "weniger vage" sind (spezifische Elemente, Inline-CSS).

Ihre Antwort hängt also davon ab, wie das Stylesheet label styles definiert. Wenn es zum Beispiel label {...} heißt, dann ist das ziemlich spezifisch, und Ihre beste Wette ist es, einen spezifischeren CSS-Stil zu verwenden, siehe:

Die Höhe der "Spezifität", die Sie, wie gesagt, überschreiben müssen, hängt davon ab, wie spezifisch Ihr anderes Stylesheet war. Laut dem Link, "CSS in den HTML-Code eingebettet sind immer nach externen Stylesheets unabhängig von der Reihenfolge in der HTML".

Es besteht auch die Möglichkeit, dass Sie label {your custom css} selbst definieren, wenn Sie Ihr Stylesheet später importieren. Es ist, was ich zuerst versuchen würde zu sehen, ob es funktioniert. Hast du das versucht? Was war das Ergebnis?

Wenn Sie das andere Stylesheet vollständig überschreiben möchten, müssen Sie auch alle nicht verwendeten CSS-Werte zurücksetzen, indem Sie die Werte auf inherit oder entsprechend anpassen.

    
ninjagecko 27.05.2011 15:00
quelle

Tags und Links