[an error occurred while processing this directive][an error occurred while processing this directive] [an error occurred while processing this directive] Cascading Style Sheets { Vollreferenz zu CSS 1 und CSS 2.1 : Kind-Selektor } [an error occurred while processing this directive]
[an error occurred while processing this directive][an error occurred while processing this directive]

Welche Entwicklungen gibt es im Bereich CSS und auf dem Büchermarkt? Die Autoren einiger beliebter CSS-Bücher haben sich bereit erklärt, die Entwicklung am Markt aus ihrer Sicht kurz darzustellen, hier auf der Buchseite.

CSS 2.1 ::Referenz ::Selektoren

CSS 2.1: Kind-Selektor (child)

Syntax:

E1 > E2 { Deklarationen }

Den Leerraum um den '>'-Kombinator kann man zur besseren Übersicht einfügen, er ist aber nicht zwingend.

Bedeutung:

Dieser Selektor spricht jedes Element E2 an, das ein direktes Kindelement des Elementes E1 ist. Diese Anforderung ist also spezifischer als die Anforderung an allgemeine Nachkommenelemente.

Um genau das erste Kind-Element von E1 zu markieren, bietet sich die Pseudoklasse :first-child an.

Beispiele:

Das erste Beispiel gilt für eine geordnete Liste, die Kind-Element von einem DIV ist.

Das zweite Beispiel gilt ebenfalls für eine geordnete Liste, die Kind-Element von einem DIV ist, aber nur, wenn das DIV selbst das erste Kindelement eines anderen Elementes ist.

DIV > OL { font-family: sans-serif; }

DIV:first-child > OL { font-family: sans-serif; }

Browserunterstützung

Die Eigenschaft wird von allen modernen Browsern unterstützt, mit folgender Ausnahme:

IE/Win 6:
MS IE/Win bis Version 6 erkennt den Kindselektor noch nicht. IE/Mac dagegen erkennt ihn.
IE 7:
Von Version 7 an kann der IE alle Selektoren verarbeiten.

Eric Meyer's CSS2 Test Suite zeigt am praktischen Beispiel, wie die Browser mit dieser Eigenschaft umgehen.

Keine Eigenschaft und kein Selektor stehen in einem Stylesheet für sich allein. In der Praxis kann das Zusammenspiel zwischen verschiedenen Elementen und Selektoren einen nicht zu unterschätzenden Einfluss auf die Fähigkeiten der Browser haben. Bugs treten oft erst durch das Zusammenwirken mehrerer Eigenschaften an unterschiedlichen Elementen auf.

Besonderheiten im Medientyp handheld:

Dieser Selektor ist Teil des Standards CSS Mobile Profile 1.0 und unterliegt damit auch in Mobilgeräten allen relevanten Regeln aus CSS 2.1. Der Kind-Selektor wird nicht von allen Mobilgeräten umgesetzt.

Verwendete Standards

Dieser CSS-Referenz liegen folgende Spezifikationen zugrunde: CSS 1, CSS 2.1 CR und CSS Mobile.


Home|Vollreferenz|Schnellreferenz|Grundlegendes|Tutorials & Artikel|Quiz|Allgemeines

Die URL dieser Seite ist: thestyleworks.de/ref/se_child.shtml
Gedruckt am [an error occurred while processing this directive] Sonntag, dem 21. [an error occurred while processing this directive] Januar, 2017.
© Copyright All Contents 2002- 2017 K. Langenberg.
Commercial Use prohibited.


Notizen: