Webkit CSS-Attribute
Aus Macwrench
Apples auf kHML basierender Webbrowser bietet (abgesehen von der Mangelhaften Unterstützung, Formularelemente mit CSS zu gestalten) so einige nette Besonderheiten:
Inhaltsverzeichnis |
focus rings
Safaris mitunter recht lästigen blauen focus-ring in input-Feldern kann man mit folgenden CSS-Attributen anpassen:
outline: none;
Mit folgendem Attribut lässt sich die Farbe anpassen:
-webkit-focus-ring-color:#123456;
Mehr Informationen dazu gibts bei Apple:
- [CSS Reference] (PDF)
- [CSS Properties]
- [CSS 2.1 Spec.] - Infos zu den Pseudoklassen hover, active und focus
Formulare
Größenänderungen von Textareas
... lassen sich über das folgende Attribut verhindern:
resize: none;
Such-Feld
Für die INPUT Felder von Formularen existiert für Safari ab Version 1.3 (für OS 10.3) und 2.0 (für OS 10.4) der typ search, der - wer hätte es gedacht - ein Suchfeld darstellt. Die Syntax dafür ist
<input type="search">
Das ist leider nicht sonderlich umfangreich per CSS zu gestalten, ein paar Attribute gibt es jedoch dazu:
incremental
beeinflusst, ob dieSuche bereits während der Eingabe gestartet werden soll.
placeholder
erlaubt die Definition eines leicht ausgegrauten Platzhalter-Textes, der verschwindet, sobald das Feld aktiv ist (also den Focus hat).
autosave
erlaubt die Angabe eines Namens, unter dem die Suchergebnisse des Dropdown-Feldes erreichbar bleiben. Diese Angabe ist global gültig, d.h. über mehrere Webseiten hinweg nutzbar (z.B. für die Verwendung von bisherigen Google-Suchen in eigenen Suchfeldern).
results attribute
erlaubt es, die Anzahl der im dropdown-Feld auszugebenden Ergebnisse festzulegen.
zusätzlich
sind die bisher bekannten Attribute wie z.B. read-only oder maxlength verwendbar.
Die ganze Sache sieht dann etwa so aus:
In anderen Browsern wird stattdessen lediglich ein normales Textfeld angezeigt, Aus dieser Richtung sollte also keine Gefahr drohen.
