Was ist ein Klassenselektor im Web-Frontend?

Der Klassenselektor im Web-Frontend dient dazu, den Selektor mit diesem Klassennamen-Tag auf der Seite zu finden. Der Klassenselektor wird verwendet, um dieselbe Präsentationsmethode für eine Reihe von Tags zu definieren ist „.class name { css attribute Name: attribute value;}“; wobei der Klassenname aus Zahlen, Buchstaben, Unterstrichen und Unterstrichen bestehen kann, aber nicht mit Zahlen oder Unterstrichen beginnen kann.

Die Betriebsumgebung dieses Tutorials: Windows 10-System, CSS3- und HTML5-Version, Dell G3-Computer.

Was ist ein Klassenselektor im Web-Frontend?

Der Klassenselektor wird verwendet, um dieselbe Präsentationsmethode für eine Reihe von Tags zu definieren. Die häufig verwendete Syntax ist .classValue{property:value}. Dabei ist classValue der Name des Klassenselektors, der vom CSS-Autor selbst benannt wird.

Klassenauswahl

Struktur:

.类名 { css属性名:属性值; }

Funktion:

Suchen Sie alle Tags mit diesem Klassennamen auf der Seite über den Klassennamen und legen Sie den Stil fest

Auf allen Tags gibt es ein Klassenattribut. Der Attributwert des Klassenattributs wird als Klassenname bezeichnet (ähnlich einem Namen).

• Der Klassenname kann aus Zahlen, Buchstaben, Unterstrichen und Unterstrichen bestehen Es darf nicht aus Zahlen oder Unterstrichen beginnen.

• Eine Beschriftung kann mehrere Klassennamen gleichzeitig enthalten, die durch Leerzeichen getrennt sind.

• Klassennamen können wiederholt werden, und ein Klassenselektor kann mehrere Beschriftungen auswählen gleichzeitig

Wissen erweitern

Was sind die am häufigsten verwendeten Selektoren im Web-Frontend?

Der erste ist der Etikettenselektor, der auch als Element bezeichnet wird Wähler. Die Grundform des Tag-Selektors lautet wie folgt: tagName{property:value}, wobei tagName der Tag-Name und property das CSS-Attribut ist.

Der zweite Typ ist der Klassenselektor, der zum Definieren derselben Präsentationsmethode für eine Reihe von Tags verwendet wird. Die häufig verwendete Syntax ist .classValue{property:value}. Dabei ist classValue der Name des Klassenselektors, der vom CSS-Autor selbst benannt wird.

Der dritte Typ ist der ID-Selektor. Der ID-Selektor definiert ein bestimmtes HTML-Element. Nur ein Tag oder Element in einer Webseite verwendet den Attributwert einer bestimmten ID. Das grundlegende Syntaxformat des ID-Selektors lautet wie folgt:

#idValue{property:value}. Dabei ist idValue der Name des ID-Selektors, der vom CSS-Autor selbst geschrieben werden kann.

Der vierte Typ ist der globale Selektor. Der globale Selektor funktioniert für alle HTMLZ-Elemente. Das Syntaxformat ist: *{propery:value}. Unter diesen bedeutet „*“, dass es für alle Elemente funktioniert, „property“ bedeutet das CSS-Attribut und „value“ bedeutet der Attributwert.

Der fünfte Typ ist der kombinierte Selektor, bei dem mehrere Selektoren zu einem zusammengesetzten Selektor kombiniert werden, der auch als kombinierter Selektor bezeichnet wird.

Die sechste Methode besteht darin, den Selektor zu erben. Die Vererbungsregel besteht darin, dass das untergeordnete Tag den Selektor des übergeordneten Tags erbt, wenn dieser nicht definiert ist wird ausgeführt.

Der siebte Typ ist der Pseudoklassenselektor. Der Pseudoklassenselektor wird hauptsächlich für Etiketten verwendet. Er verfügt über vier Zustände: nicht besuchter Link (Link), besuchter Link (besucht), aktivierter Link (aktiv) und Mouseover-Verbindung (). schweben).

【Verwandte Empfehlungen:

Javascript-Video-Tutorial

,

Web-Frontend

】

Das obige ist der detaillierte Inhalt vonWas ist ein Klassenselektor im Web-Frontend?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!