Schönere Formulare mit CSS

Das Einheitsgrau im Formulardesign muss nicht sein, denn mit CSS sind dem Webdesigner mächtige Möglichkeiten gegeben, um einzelne Elemente der Seite per Style Sheet zu beeinflussen.

<input type="text" value="Standard-Formular">

Mit dem Zusatz style="border: 1px solid black" lässt sich schon viel erreichen:

<input type="text" value="Standard-Formular" 
style="border: 1px solid black">

Anderer Randstil:

<input type="text" value="Standard-Formular" 
style="border: 1px dotted red">

Oder durchsichtig:

<input type="text" value="Standard-Formular" 
style="border: 1px dotted red; 
background: transparent">

Mit eigenen Farben:

<input type="text" value="Standard-Formular" 
style="border: 1px solid black; 
background-color: #777777; 
color: white;">

Oder Hintergrundbild:

<input type="text" value="Standard-Formular" 
style="border: 1px solid black; 
background-image:url(hintergrund.gif)">

Durchsichtig über Bild mit 3D Effekt:

<table width=275 border=0 cellpadding=5>
<tr><td background="hintergrund.gif">
<input type="text" value="Standard-Formular" 
style="border-top: 1px solid white; 
border-left: 1px solid white; 
border-right: 1px solid #555555; 
border-bottom: 1px solid #555555; 
color: white; background: transparent;">
</td></tr></table>

Siehe auch: Schönere Formular-Buttons