Ein Suchformular mit CSS3 gestaltet
Samstag, 5. Juni 2010
Ich habe das Suchfeld auf dieser Seite mal ein wenig “aufgehübscht". Ohne ein einziges Bild, ausschließlich mit CSS. Und weil inzwischen alle modernen Browser CSS3 unterstützen, habe ich ausgiebig Gebrauch gemacht von den CSS3-Eigenschaften radius, gradient und box-shadow.
Im Browser sieht das Suchfeld so aus:

Demo mit CSS im Quelltext
Abgelegt unter:
2 Kommentare
Einen Kommentar abgeben
XHTML erlaubt: <a href="" title="" rel=""> <abbr title=""> <acronym title=""> <b> <blockquote> <code> <em> <i> <strike> <strong>
Code-Beispiele
Damit Code-Beispiele richtig angezeigt werden, müssen Sonderzeichen maskiert werden (z.B. < zu <).

Fritz, gefällt mir gut Dein neues Suchformular. Allerdings wird es im Internet Explorer eckig angezeigt, aber das weist Du ja.
Dafür sieht es in allen Browsern gut aus.
In modernen Browsern heben sich die Rundungen vom restlichen Layout ab und heben damit die Suchfunktion hervor.
Kommentar von Dieter (Webseiten-Infos.de) — Samstag, 5. Juni 2010 - 18:18 Uhr
Hallo Dieter,
wie kommst du denn auf die Idee, ich wüsste, dass der IE “eckige Rundungen” zeigt? Dazu müsste ich ja den IE anwerfen und damit testen!
Kommentar von Fritz — Samstag, 5. Juni 2010 - 18:47 Uhr