Heim > häufiges Problem > Was sind die Pseudoklassenselektoren?

Was sind die Pseudoklassenselektoren?

百草
Freigeben: 2023-10-07 16:20:39
Original
1368 Leute haben es durchsucht

Zu den Pseudoklassenselektoren gehören:hover, :active, :focus, :visited, :link, :first-child, :last-child, :nth-child(n), :nth-last-child(n), :nth-of-type(n), :nth-last-of-type(n), :not(selector), :empty, :checked, :disabled usw.

Was sind die Pseudoklassenselektoren?

Das Betriebssystem dieses Tutorials: Windows 10-System, DELL G3-Computer.

Pseudoklassenselektor ist ein leistungsstarker Selektor in CSS, der zum Auswählen bestimmter Zustände oder Bedingungen von Elementen verwendet wird. Pseudoklassenselektoren beginnen mit einem Doppelpunkt (:) und werden verwendet, um verschiedene Elementzustände auszuwählen, z. B. Mauszeiger, besuchte Links, Elementposition usw. Im Folgenden sind gängige Pseudoklassenselektoren in CSS aufgeführt:

1. :hover: Wählen Sie den Zustand aus, wenn sich die Maus über dem Element befindet. Bestimmte Stile können auf Elemente angewendet werden, wenn der Mauszeiger darüber bewegt wird.

2. :aktiv: Wählen Sie den Zustand aus, in dem das Element aktiviert oder gedrückt ist. Bestimmte Stile können auf Elemente angewendet werden, wenn der Benutzer klickt oder die Maustaste drückt.

3. :focus: Wählen Sie das Element aus, das gerade den Fokus erhält. Bestimmte Stile können auf Elemente angewendet werden, wenn diese ausgewählt sind oder den Fokus haben.

4. :besucht: Wählen Sie den besuchten Link aus. Nachdem ein Benutzer einen Link besucht hat, können Sie bestimmte Stile auf den Link anwenden.

5. :link: Wählen Sie einen nicht besuchten Link. Entspricht der Pseudoklasse :visited, die zur Auswahl nicht besuchter Links verwendet wird.

6. :first-child: Wählen Sie das erste untergeordnete Element des Elements aus. Bestimmte Stile können auf ein Element angewendet werden, wenn es das erste untergeordnete Element seines übergeordneten Elements ist.

7. :last-child: Wählen Sie das letzte untergeordnete Element des Elements aus. Bestimmte Stile können auf ein Element angewendet werden, wenn es das letzte untergeordnete Element seines übergeordneten Elements ist.

8. :nth-child(n): Wählen Sie das n-te untergeordnete Element des Elements aus. Ein bestimmter Stil kann auf ein Element angewendet werden, wenn es das n-te untergeordnete Element seines übergeordneten Elements ist. Dabei kann n eine bestimmte Zahl, ein Schlüsselwort (z. B. gerade, ungerade) oder ein Ausdruck (z. B. 2n, 3n+1) sein.

9. :nth-last-child(n): Wählen Sie das n-te untergeordnete Element am unteren Rand des Elements aus. Ein bestimmter Stil kann auf ein Element angewendet werden, wenn es das n-te untergeordnete Element seines übergeordneten Elements ist.

10. :nth-of-type(n): Wählen Sie das n-te Element unter Elementen desselben Typs aus. Ein bestimmter Stil kann auf ein Element angewendet werden, wenn es das n-te Element seines Typs ist.

11. :nth-last-of-type(n): Wählen Sie das n-te Element vom letzten unter den Elementen desselben Typs aus. Sie können einem Element einen bestimmten Stil zuweisen, wenn es das n-te Element vom letzten seines Typs ist.

12. :not(selector): Elemente auswählen, die nicht mit einem bestimmten Selektor übereinstimmen. Mit diesem Pseudoselektor können Sie bestimmte Elemente ausschließen und andere Elemente auswählen, auf die Stile angewendet werden sollen.

13. :empty: Elemente ohne untergeordnete Elemente auswählen. Bestimmte Stile können auf ein Element angewendet werden, wenn es keine untergeordneten Elemente hat.

14. :markiert: Wählen Sie das ausgewählte Formularelement aus. Gilt für Formularelemente wie Kontrollkästchen, Optionsfelder und Dropdown-Listen.

15. :disabled: Deaktivierte Formularelemente auswählen. Wenn ein Formularelement deaktiviert ist, können bestimmte Stile auf das Element angewendet werden.

Die oben genannten sind gängige Pseudoklassenselektoren in CSS. Sie können Elemente in Webseiten basierend auf dem Status oder den Bedingungen der Elemente auswählen und formatieren. Durch den rationalen Einsatz dieser Pseudoklassenselektoren können wir reichhaltige und vielfältige Effekte erzielen und die Benutzererfahrung und Seitenlesbarkeit verbessern.

Das obige ist der detaillierte Inhalt vonWas sind die Pseudoklassenselektoren?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Neueste Artikel des Autors
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage