*
Login-Header
blockHeaderEditIcon
Social-media-Header
blockHeaderEditIcon
Worldsoft-Logo
blockHeaderEditIcon
Worldsoft Logo
Menu
blockHeaderEditIcon

Anleitung Formulare mithilfe von CSS verschönern

Benötigt: Formulare(Oasis) und CSS.

Auf dieser Seite wurde ein Beispiel Formular verwendet das keine Funktionen besitzt. Bitte füllen sie dieses Formular nicht aus.

Erklärung:

Zuerst müssen Sie ein Formular in der CMS anlegen. Ich empfehle Ihnen den Formular-Generator zu verwenden. Sobald sie die Formular Felder angelegt haben entspricht das Layout sehr wahrscheinlich nicht ihren Vorstellungen.

CSS Klassen die wir gestalten müssen. Die einzige arbeite wird sein im CSS die Klassen zu gestalten da das Formular(HTML-Code) schon vorgegeben ist.

Erklärung der verwendeten CSS Klassen für ein Formular
1 input[type="text"] Das sind alle Standard Eingabe Felder im Formular wie Vorname, Nachname
2 input[type="submit"] Das ist der Abschick Button zu unterst bei einem Formular
3 select Das sind alle Auswahlfelder/Dropdowns in einem Formualr wie Sprache, Land
4 textarea Das sind die grossen Eingabe Felder in dennen man längere Nachrichten schreiben kann, meistens nur einmal auf dem Formular vorhanden

Formular CSS

Das unter Formular entspricht dem CSS das Links davon aufgelistet ist.

Anrede:
Sprache:
Vorname:
Nachname:
Stadt:
Strasse:
Postleitzahl:
Land:
E-Mail:
Telefonnummer:
Ihre Nachricht:
* Erforderlich

Erklärung der verwendeten CSS Eigenschaften für ein Formular
1 cursor:pointer; Beim hovern wird anstatt des Standard Mouse-Cursor eine Hand angezeigt
2 appearance
3 transition-property
4 transition-duration
4 transition-timing-function Die Zeit in der die Animation von dem Hintergrund beim hovern verändert wird
Code-Download: Formular CSS Code
MultiuserSpecial
blockHeaderEditIcon

Hier können Sie einen kostenfreien Beratungstermin bei Ihrem Alliance-Webmasters Gert F. Lang anfordern:

Liste der regionalen Webmaster

Hier finden Sie eine Liste der bewährtesten regionalen Alliance-Webmaster mit jeweiligen Referenz-Websites. Über das Online-Formular können Sie gleich einen kostenfreien Beratungstermin anfordern:

Liste der regionalen Webmaster

backtotop
blockHeaderEditIcon
Footer-06
blockHeaderEditIcon
Benutzername:
User-Login
Ihr E-Mail
Geben Sie bitte eine gültige Postleitzahl ein.
Geben Sie bitte eine gültige Telefonnummer ein.
Bitte korrigieren Sie dieses Feld.
Bitte Vorname und Nachname eingeben.