Sprung zum Inhalt

Webdesign nach Maß von webdesign weisshart

Mein Blog

RSS Feed AbonnementRSS 2.0 Feed

zum Archiv und den Kategorien

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



3 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

  3. It was interesting to see the search form that you have created using with CSS3. I have also gone through the Demo with CSS in the source code. It was so nice of you to share the image and I will share this with my friends are trying to implement the same.

    Kommentar von Maria — Dienstag, 22. April 2014 - 11:00 Uhr

Einen Kommentar abgeben

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.

Archiv:

Kategorien:

Creative Commons Lizenzvertrag
Alle Texte (nicht Bilder!) Creative Commons CC BY-NC-SA 3.0 DE