Formular-Vorlagen in HTML
Formulare sind ein wichtiger Bestandteil einer Webseite um mit den Usern
zu kommunizieren.
Um Inputs von Besuchern zu erhalten brauchen sie Formulare:
Arten von Formularen:
-Kontaktformulare-Suchformulare
-Bestellformulare
Das Formular beginnt mit dem Element <form> und endet mit </form>. Ein HTML <form> beinhaltet Formular-Elemente.
Unten sind 2 Formular-Vorlagen dargestellt die Sie über die Zwischenablage in ihren HTML-Code einfügen können und nach Belieben ändern können. Unter der Page "forms.htm" sehen sie ausführlich alle Formulare-Elemente.
| <!DOCTYPE html> |
| <html> |
| <head> |
| <title>Page</title> |
| </head> |
| <body> |
| <form action="action_page.php" method="post"> |
| <table> |
| <tbody> |
| <tr> |
| <td>Abteilung:</td> |
| <td> |
| <select name="Abteilung"> |
| <option value="Werkstatt">Werkstatt</option> |
| <option value="Verkauf">Verkauf</option> |
| <option value="Administration">Administration</option> |
| </select> |
| </td> |
| </tr> |
| <tr> |
| <td>Anrede:</td> |
| <td> |
| <input name="Anrede" type="radio" value="Herr" /> Herr |
| <input name="Anrede" type="radio" value="Frau" /> Frau |
| </td> |
| </tr> |
| <tr> |
| <td>Vorname:</td> |
| <td> |
| <input maxlength="10" name="Vorname" size="20" type="text" /> |
| </td> |
| </tr> |
| <tr> |
| <td>Nachname:</td> |
| <td> |
| <input name="Nachname" size="20" type="text" /> |
| </td> |
| </tr> |
| <tr> |
| <td>Email:</td> |
| <td> |
| <input name="Email" size="20" type="email" /> |
| </td> |
| </tr> |
| <tr> |
| <td>Betreff:</td> |
| <td> |
| <input name="Betreff" size="20" type="text" /> |
| </td> |
| </tr> |
| <tr> |
| <td></td> |
| <td> |
| Bitte schicken Sie mir Informationen über folgende Themen zu:<br> |
| <input name="InfosAuto" type="checkbox" value="neueAutos" />neue Autos |
| <input name="InfosAuto" type="checkbox" value="gebrauchteAutos"/>gebrauchte Autos |
| </td> |
| </tr> |
| <tr> |
| <td>Mitteilung:</td> |
| <td><textarea cols="15" rows="5" name="Mitteilung">Ihre Mitteilung</textarea></td> |
| </tr> |
| <tr> |
| <td></td> |
| <td> |
| <input type="submit" value="Abschicken" /> |
| </td> |
| </tr> |
| </tbody> |
| </table> |
| </form> |
| </body> |
| </html> |
| <!DOCTYPE html> |
| <html> |
| <head> |
| <title>Page</title> |
| </head> |
| <body> |
| <form action="action_page.php" method="post"> |
| <table> |
| <tbody> |
| <tr> |
| <td>Firma:</td> |
| <td> |
| <input maxlength="15" name="Firma" size="20" type="text" /> |
| </td> |
| </tr> |
| <tr> |
| <td>Anrede:</td> |
| <td> |
| <select name="geschl"> |
| <option value="m">Herr</option> |
| <option value="f">Frau</option> |
| </select> |
| </td> |
| </tr> |
| <tr> |
| <td>Vorname:</td> |
| <td> |
| <input maxlength="15" name="Vorname" size="20" type="text" /> |
| </td> |
| </tr> |
| <tr> |
| <td>Nachname:</td> |
| <td> |
| <input maxlength="15" name="Nachname" size="20" type="text" /> |
| </td> |
| </tr> |
| <tr> |
| <td>Strasse:</td> |
| <td> |
| <input maxlength="15" name="Strasse" size="20" type="text" /> |
| </td> |
| </tr> |
| <tr> |
| <td>PLZ:</td> |
| <td> |
| <input maxlength="5" name="PLZ" size="7" type="text" /> |
| </td> |
| </tr> |
| <tr> |
| <td>Ort:</td> |
| <td> |
| <input maxlength="15" name="Ort" size="20" type="text" /> |
| </td> |
| </tr> |
| <tr> |
| <td>Land:</td> |
| <td> |
| <input name="Land" size="20" type="text" /> |
| </td> |
| </tr> |
| <tr> |
| <td>Homepage:</td> |
| <td> |
| <input name="Homepage" size="20" type="url" /> |
| </td> |
| </tr> |
| <tr> |
| <td>Email:</td> |
| <td> |
| <input maxlength="25" name="Email" size="20" type="email" /> |
| </td> |
| </tr> |
| <tr> |
| <td></td> |
| <td> |
| <input type="submit" value="Registrieren" /> |
| </td> |
| </tr> |
| </tbody> |
| </table> |
| </form> |
| </body> |
| </html> |
