Attributselektoren
Gestern habe ich was entdeckt, was vielleicht für jemanden nützlich sein könnte
Ich musste per CSS eine Inputbox mit gewissem Namen und/oder Typ formatieren.
Dies ist mit folgendem Befehl im CSS-File möglich: Selektor[Attribut=Wert]{ CSS; }
Beispiel HTML:
<html><head></head><body>
<input type=”text” name=”username” />
<input type=”text” name=”email” />
</body></html>
Beispiel CSS:
input[type=text]{ border: 1px solid white; }
input[name=email]{ background-color: #CCCCCC; }
Die erste Formatierung wird beiden Eingabefeldern einen weissen Rand mit der Grösse von 1px anzeigen. Die zweite Formatierung verpasst dem Eingabefeld (name=email) einen grauen Hintergrund.
Dies kann auch nützlich sein, um z.B. vor gewissen Links ein Icon anzuzeigen:
a[href $='.pdf'] {
padding: 5px 0 5px 20px;
background: url(icons/pdf.gif) no-repeat center left;}
Hinweis: Attribut-Selektoren werden vom IE6 nicht unterstützt!
Eine Liste mit weiteren Informationen und Beispielen findet ihr hier:
http://www.intensivstation.ch/css/selectors/attribute-selectors/
Du kannst alle Antworten zu diesem Eintrag via RSS 2.0 Feed erfolgen. Du kannst einen Kommentar hinterlassen, oder einen Trackback von deiner eigenen Seite.