Wenn es um die Gestaltung von Formularen geht, hauen einen Typ-Selektoren nicht unbedingt vom Hocker. Schließlich wird für Textfelder, Radiobuttons, Checkboxen, Passwortfelder und Buttons das gleiche HTML-Tag benutzt: <input>. Eine Breitenangabe von 200 Pixeln mag für ein Textfeld sinnvoll sein, Ihre Checkboxen sollen aber vermutlich nicht ganz so groß ausfallen. Das heißt, Sie können nicht einfach schreiben: input { width: 200px; }. Momentan besteht die verlässlichste Methode darin, Textfelder mit einer eigenen Klasse zu markieren, z.B. <input type=“text“ class=“textfeld“ name=“email“ />. Über den entsprechenden Klassen-Selektor können dann eigene Stilregeln definiert werden.
Vermutlich schon bald können Sie allerdings den Attribut-Selektor für diese Aufgabe verwenden, der wesentlich mehr Möglichkeiten bietet. Ein Attribut-Selektor wählt ein HTML-Element anhand seines Attributs aus. Bei <input>-Tags bestimmt der Wert des Attributs type, welche Art von Formularelement tatsächlich erzeugt wird. Für ein Textfeld ist dies beispielsweise der Wert text. Um den Hintergrund für alle einzeiligen Textfelder blau einzufärben, könnten Sie die folgende Regel verwenden:
input[type=“text“] { background-color: blue; }
Wenn Sie den Attributwert im obigen Beispiel von text in submit ändern, wird stattdessen eine Regel für Submit-Buttons angelegt. Da die meisten aktuellen Browser (inklusive IE 7, IE 8 und Google Chrome) inzwischen Attribut-Selektoren verstehen, können Sie schon jetzt auf die lästigen Klassen verzichten. Außerdem sind Attribut-Selektoren längst nicht auf Formularelemente beschränkt. Sie können damit jedes Tag auswählen, für das ein Attribut definiert wurde. Dies ist der Selektor für Links auf die CosmoFarmer.com-Website: a[href=“http:// www.cosmofarmer.com“]. CSS 3 verspricht noch wesentlich vielfältigere Attribut-Selektoren inklusive der Fähigkeit, Tags nach dem Anfang (z.B. http://) oder Ende (z.B. .jpg oder .pdf) ihres Attributwerts auszuwählen.
Auszug aus dem neuerschienenen CSS Missing Manual von David Sawyer McFarland.