Heim  >  Artikel  >  Web-Frontend  >  Welche Arten von CSS-Pseudoklassen gibt es?

Welche Arten von CSS-Pseudoklassen gibt es?

王林
王林Original
2020-11-17 11:27:073866Durchsuche

CSS-Pseudoklassen werden in zwei Typen unterteilt: UI-Pseudoklassen und strukturierte Pseudoklassen. UI-Pseudoklassen werden in Link-Pseudoklassen, Fokus-Pseudoklassen und Ziel-Pseudoklassen unterteilt. Strukturierte Pseudoklassen werden in [:first-child], [:last-child] und [:nth-child] unterteilt.

Welche Arten von CSS-Pseudoklassen gibt es?

Es gibt zwei Arten von CSS-Pseudoklassen:

1. UI-Pseudoklasse: Wenn sich das HTML-Element in einem bestimmten Zustand befindet (z. B. wenn sich der Mauszeiger auf einer Verbindung befindet), werden CSS-Stile angewendet zum Element.

2. Strukturierte Pseudoklasse: Wenn es eine bestimmte strukturelle Beziehung im Markup gibt (z. B. wenn ein Element das erste oder letzte in einer Gruppe von Elementen ist), werden CSS-Stile auf die Antwortelemente angewendet.

(Teilen von Lernvideos: CSS-Video-Tutorial)

UI-Pseudoklasse: Das am häufigsten verwendete UI-Pseudoklassenelement ist der Link (ein Element).

Es ist in drei Typen unterteilt:

1 Link-Pseudoklasse: Es gibt insgesamt vier, und der Link befindet sich immer in einem der vier Zustände.

(1) Link Der Link befindet sich genau dort und wartet darauf, dass der Benutzer darauf klickt.

(2) Der besuchte Benutzer hat bereits zuvor auf diesen Link geklickt.

(3)Hover Der Mauszeiger schwebt über dem Link.

(4) Der Link „Aktiv“ wird angeklickt (die Maus wird auf das Element gedrückt und nicht losgelassen).

2. Fokus-Pseudoklasse (Fokus)

3. Ziel-Pseudoklasse (Wenn der Benutzer auf einen Link zu anderen Elementen auf einer Kartonseite klickt, ist dieses Element das Ziel (Ziel), und Sie können Folgendes verwenden: Ziel-Pseudoklasse, um sie auszuwählen.)

Strukturierte Pseudoklassen:

1, :first-child und :last-child

: first-child stellt das erste Element in einer Gruppe von Geschwisterelementen dar, während :last- Das Kind repräsentiert das letzte.

2. :nth-child: wählt jedes n-te Element in einer Reihe von Listenelementen aus.

Verwandte Empfehlungen: CSS-Tutorial

Das obige ist der detaillierte Inhalt vonWelche Arten von CSS-Pseudoklassen gibt es?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
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