Sprung zum Inhalt [S] Tastaturkürzel / Accesskeys [0]
webdesign weisshart Startseite

Webdesign nach Maß von webdesign weisshart

Mein Blog

RSS Feed AbonnementRSS 2.0 Feed

zur Liste der Kategorien | zum Archiv

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:
Screenshot
Demo mit CSS im Quelltext


2 Kommentare

  1. 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

  2. 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

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 &lt;).


(notwendig)

(notwendig)

Spamschutz:
Je nach Inhalt wird Ihr Kommentar eventuell nicht sofort angezeigt, sondern muss manuell freigeschaltet werden.

Partnerseiten: barrierefreies WebDesign

Tastaturkürzel

zum Seitenanfang