Introduction to CSS Selectors

Im Kapitel zur Anatomie von CSS haben wir bereits kurz über Selektoren gesprochen, doch wie du bald sehen wirst, kommen Selektoren in vielen Formen und Kombinationen. Selektoren können sehr stark sein und das meiste Styling wäre ohne sie nicht möglich.

Wie bereits genannt, gruppiert ein Selektor eine beliebige Anzahl von Eigenschaften, welche das Verhalten und Aussehen für ein bestimmtes Element definieren. Das beste an Selektoren ist, dass sie dir erlauben, ein Element auf verschiedene Weisen anzusprechen: In verschiedenen Zuständen (States), Hierarchien oder auch mehrere Elemente zugleich.

Benennung der Selektoren

Ein Selektorname muss mit einem Buchstaben (a-z), einem Unterstrich (_) oder einem Bindestrich (-) beginnen und kann dann von einer beliebigen Zahl von Binde- und Unterstrichen, Buchstaben und/oder Zahlen gefolgt werden. Wenn du deine Selektoren benennst, gibt es einige Zeichen, die du nicht verwenden kannst. Normalerweise, weil sie eine besondere Bedeutung haben. Diese Zeichen behandeln wir später im Tutorial.

Zusammenfassung

Ein Selektor ist ein Name und eine oder mehrere Eigenschaften. In den nächsten Kapiteln werde ich dir alle Möglichkeiten zeigen, einen Selektor zu verwenden. Um das am besten zu demonstrieren, werde ich mehrere CSS-Eigenschaften benutzen. Du musst sie nicht alle kennen, aber keine Sorge – sie werden später alle erklärt. Ich verwende sie nun, weil leere Selektoren keinen guten Eindruck von der Funktionsweise von CSS geben. Wenn du mehr über die verwendeten Eigenschaften erfahren möchtest, kannst du nach Belieben in diesem Tutorial hin- und herspringen.