Webdesign mit (X)HTML und CSS

Ein Kurs für Einsteiger

Sie sind hier

Startseite › CSS › Grundlagen › Selektoren
aktualisiert:
05.10.2008
erstellt:
07.02.2007

Selektoren

Durch Selektoren werden CSS-Angaben dem gewünschten Bereich zugeordnet.

Die Deklarationen (eine oder mehrere, durch Semikolon getrennt) pro Selektor werden in geschweifte Klammern gefasst. Dies nennt man einen Deklarationsblock.

Selektor und Deklarationsblock bilden eine Regel

  1. <head>
  2. […]
  3. <style type="text/css">
  4. p {
  5. color:red;
  6. background-color:green;
  7. }
  8. </style>
  9. </head>

Diese Angabe weist allen p-Elementen im Dokument eine rote Textfarbe und eine grüne Hintergrundfarbe zu.

Ein Deklarationsblock kann auch für mehrere Selektoren gelten. Diese werden dann duch ein Komma getrennt notiert. Nach dem letzten Selektor darf kein Komma stehen.

  1. <head>
  2. […]
  3. <style type="text/css">
  4. h1, h2, p {
  5. color:red;
  6. background-color:green;
  7. }
  8. </style>
  9. </head>

Durch geschickte Wahl von Selektoren kann jedes Element im Dokument gezielt angesprochen werden (siehe Arten von Selektoren)