<fieldset> und <legend>
<fieldset> <legend>Prinzip
Grössere Formulare bestehen häufig aus Gruppen von Elementen.
Ein typisches Bestellformular besteht beispielsweise aus Elementgruppen wie "Absender", "bestellte Produkte" und "Formular absenden/abbrechen".
Ein Web-Browser kann Elementgruppen durch Linien oder ähnliche Effekte optisch sichtbar machen.
<fieldset> <legend>
Codes
<fieldset> Gruppe mit Titel und Rahmen
<legend> Bezeichnung der Felder
Erzeugung der Gruppen mit <fieldset>
Es wurden zwei Gruppen erzeugt:
Die erste Gruppe: für den Absender
Die zweite Gruppe: für den Wunsch
Namen der Gruppen mit <legend>
Die erste Gruppe hat den Namen: "Absender"
Die zweite Gruppe hat den Namen: "Wunsch"
Bezeichnung der Felder mit <label>
In der ersten Gruppe sind die Felder: "Vorname" und "Nachname"
In der zweiten Gruppe sind die Felder: "Ihr Hauptwunsch" und "Ihr Zusatzwunsch"
1) Quelltext
<form action="..." method="post"> <fieldset> <legend>Absender</legend> <label for="fieldset_vorname">Ihr Vorname</label> <input type="text" name="fieldset_vorname" id="fieldset_vorname" size="40" maxlength="40"><br> <label for="fieldset_nachname">Ihr Nachname</label> <input type="text" name="fieldset_nachname" id="fieldset_nachname" size="40" maxlength="40" ><br> </fieldset> <fieldset> <legend>Wunsch</legend> <label for="fieldset_hauptwunsch">Ihr Hauptwunsch</label> <input type="text" name="fieldset_hauptwunsch" id="fieldset_hauptwunsch" size="40" maxlength="40"><br> <label for="fieldset_zusatzwunsch">Ihr Zusatzwunsch</label> <input type="text" name="fieldset_zusatzwunsch" id="fieldset_zusatzwunsch" size="40" maxlength="40" ><br> </fieldset> </form>
3) Stylesheet
legend {
font-weight:bold;
}
3) Anzeige im HTML-Dokument