Heim > Artikel > Web-Frontend > Welche Funktion hat das Klassen-Tag in CSS?
Klasse in CSS ist kein Tag, sondern ein Klassenselektor, dessen Funktion darin besteht, den Stil aller Elemente der Klasse anzugeben. Bevor Sie den Klassenselektor verwenden, müssen Sie das spezifische Dokument-Markup ändern, damit der Klassenselektor funktionieren kann ordnungsgemäß; und um den Stil des Klassenselektors zu verwenden, ist er mit dem Element verknüpft, und die Klasse muss als geeigneter Wert angegeben werden.
Die Betriebsumgebung dieses Tutorials: Windows 10-System, CSS3-Version, DELL G3-Computer
Welche Rolle spielt das Klassen-Tag in CSS?
class in CSS ist kein Label, sondern ein Klassenselektor.
class ist ein Klassenselektor, mit dem Stile unabhängig von Dokumentelementen angegeben werden können.
Bevor Sie Klassenselektoren verwenden, muss das spezifische Dokument-Markup geändert werden, damit Klassenselektoren ordnungsgemäß funktionieren.
Um den Stil eines Klassenselektors einem Element zuzuordnen, muss die Klasse als geeigneter Wert angegeben werden. Schauen Sie sich den HTML-Code unten an:
<h1 class="important"> This heading is very important. </h1> <p class="important"> This paragraph is very important. </p>
Im obigen Code wird die Klasse von zwei Elementen als wichtig angegeben: der erste Titel (h1-Element) und der zweite Absatz (p-Element).
Verwandte Einführung:
Die Situation, in der der Klassenwert ein Wort enthält. In HTML kann ein Klassenwert eine durch Leerzeichen getrennte Liste von Wörtern enthalten.
Wenn Sie beispielsweise ein bestimmtes Element als wichtig und als Warnung markieren möchten, können Sie Folgendes schreiben:
Die Reihenfolge dieser beiden Wörter spielt keine Rolle, sie können auch als Warnung wichtig geschrieben werden.
Angenommen, alle Elemente mit der Klasse „Wichtig“ sind fett und alle Elemente mit der Klasse „Warnung“ sind kursiv. Alle Elemente mit der Klasse „Wichtig“ und „Warnung“ haben ebenfalls einen silbernen Hintergrund.
Sie können schreiben: .important {font-weight:bold;} .warning {font-weight:italic;} .important.warning {background:silver;} Durch die Verknüpfung zweier Klassenselektoren werden nur Elemente mit diesen Klassennamen enthalten gleichzeitig (die Reihenfolge der Klassennamen ist nicht begrenzt).
Empfohlenes Lernen: „CSS-Video-Tutorial“
Das obige ist der detaillierte Inhalt vonWelche Funktion hat das Klassen-Tag in CSS?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!