Wie sieht der CSS-Klassenselektor aus (Code)

In CSS wird die Klassenauswahl in einer Punktnummer angezeigt: (Empfohlenes Lernen: Tutorial zur CSS-Eingabe ) 🎜>

.center {text-align: center}

Im obigen Beispiel sind alle HTML-Elemente mit der Center-Klasse zentriert.

Im folgenden HTML-Code haben sowohl das h1- als auch das p-Element die Mittelklasse. Das bedeutet, dass beide die Regeln im „.center“-Selektor respektieren.

<h1 class="center">
This heading will be center-aligned
</h1>
<p class="center">
This paragraph will also be center-aligned.
</p>

Hinweis: Zahlen können nicht als erstes Zeichen des Klassennamens verwendet werden! Es funktioniert nicht in Mozilla oder Firefox.

Wie id kann auch class als abgeleiteter Selektor verwendet werden:

.fancy td {
	color: #f60;
	background: #666;
	}

Im obigen Beispiel ist der Klassenname fancy in größeren Tabellenzellen enthalten Das Element zeigt orangefarbenen Text auf grauem Hintergrund an. (Ein größeres Element mit dem Namen fancy könnte eine Tabelle oder ein Div sein)

Elemente können auch basierend auf ihrer Klasse ausgewählt werden:

td.fancy {
	color: #f60;
	background: #666;
	}

oben Im Beispiel die Tabelle Die Zelle mit dem Klassennamen fancy ist orange mit grauem Hintergrund.

<td class="fancy">

Sie können jedem Tabellenelement beliebig oft die Klasse fancy zuweisen. Mit Fancy markierte Zellen sind orange mit grauem Hintergrund. Zellen, denen keine Klasse namens fancy zugewiesen ist, sind von dieser Regel nicht betroffen.

Es ist auch erwähnenswert, dass Absätze mit der Kategorie „Fancy“ nicht orange mit einem grauen Hintergrund angezeigt werden. Alle anderen als „Fancy“ gekennzeichneten Elemente sind von dieser Regel natürlich nicht betroffen. Dies ist alles auf die Art und Weise zurückzuführen, wie wir diese Regel geschrieben haben. Der Effekt ist auf Tabellenzellen beschränkt, die als ausgefallen markiert sind (d. h. die Verwendung des td-Elements zur Auswahl der ausgefallenen Klasse).

Das obige ist der detaillierte Inhalt vonWie sieht der CSS-Klassenselektor aus (Code). Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!