Heim > Web-Frontend > CSS-Tutorial > Hauptteil

Hier sind einige fragenbasierte Titel, die zum Artikelinhalt passen: Konzentration auf den Kernunterschied: * Warum funktioniert „.class:last-of-type' nicht wie „.class:last-of-class'? * Was ist das wahre Verhalten?

DDD
Freigeben: 2024-10-26 02:18:27
Original
228 Leute haben es durchsucht

Here are some question-based titles that fit the article content:

Focusing on the core difference:

* Why Doesn't `.class:last-of-type` Work Like `.class:last-of-class`?
* What's the Real Behavior of the `.class:last-of-type` Selector?
* Understanding

Verstehen des Verhaltens von .class:last-of-type

Das Problem besteht darin, dass der Selektor .class:last-of- Der Typ funktioniert nicht wie ein .class:last-of-class-Selektor. Stattdessen zielt es speziell auf Elemente ab, die die letzten Geschwister ihres Typs innerhalb eines Containerelements sind.

Grundlegendes zu .last-of-type

Gemäß der W3C-Spezifikation gilt: Die Pseudoklasse .last-of-type stellt Elemente dar, die die letzten Geschwister ihres Typs sind. Das bedeutet:

  1. Es prüft, ob in jedem Containerelement im HTML Elementlisten vorhanden sind.
  2. Es identifiziert das letzte Element in jeder Liste.
  3. Es überprüft dass das letzte Element mit dem angegebenen Elementtyp übereinstimmt (z. B. p).

Anwenden der Regeln

Im bereitgestellten Beispiel ist der Selektor .visible:last -of-type wird verwendet. Dies bedeutet, dass die Stile nur auf Folgendes angewendet werden:

  • Elemente, die ein p-Tag sind.
  • Elemente, die die Klasse .visible haben.
  • Elemente, die das sind letztes p-Tag mit der .visible-Klasse in ihrem Containerelement.

Problem lösen

Da nur die ersten beiden p-Elemente die .visible-Klasse haben, Das dritte p-Element erfüllt nicht die Kriterien für den Selektor .visible:last-of-type. Daher wird seine Anzeigeeigenschaft nicht auf „Blockieren“ gesetzt.

Um das gewünschte Ergebnis zu erzielen, ziehen Sie die folgenden Optionen in Betracht:

  • Stellen Sie sicher, dass das endgültige Das p-Tag verfügt außerdem über die Klasse .visible.
  • Wenn JavaScript nicht verwendet werden kann, erkunden Sie alternative CSS-Ansätze, um das letzte p-Element mit einer bestimmten Klasse auszuwählen.

Das obige ist der detaillierte Inhalt vonHier sind einige fragenbasierte Titel, die zum Artikelinhalt passen: Konzentration auf den Kernunterschied: * Warum funktioniert „.class:last-of-type' nicht wie „.class:last-of-class'? * Was ist das wahre Verhalten?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

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
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage