Das Tag <fieldset> gruppiert logisch miteinander verbundene Elemente der Form, die durch das HTML-Tag <form> definiert werden. Im Browser wird der Inhalt des Tages voreingestellt im Rahmen hervorgehoben.
Für die Überschriftsdefinition der logischen Gruppe, die durch das Element <fieldset> bestimmt wird, wird das Tag <legend> verwendet.
Syntax
Der Inhalt des Tges wird zwischen den Start- (<fieldset>) und Endtags (</fieldset>) geschrieben.
Beispiel
<!DOCTYPE html>
<html>
<head>
<title>Der Titel des Dokuments</title>
<style>
div {
margin-bottom: 10px;
}
label {
display: inline-block;
width: 120px;
}
</style>
</head>
<body>
<form>
<fieldset style="background:#e1eff2;">
<legend style="padding:20px 0; font-size:20px;">Personenbezogene Information:</legend>
<div><label>Name:</label><input type="text"></div>
<div><label> E-Mail:</label><input type="text"></div>
<div><label>Geburtsdatum:</label><input type="text"></div>
<div><label>Geburtsort:</label><input type="text"></div>
</fieldset>
</form>
</body>
</html>
Ergebnis
Attribute
Attribut | Wert | Beschreibung |
---|---|---|
disabled | dsabled | Es definiert, dass eine Gruppe von verwandten Elementen deaktiviert werden muss. |
form | form_id | Es definiert ein oder mehrere Form-IDs, zu denen die Gruppe von verbundenen Elementen gehört. Wenn es einige IDs gibt, müssen sie voneinander mit einem Leerzeichen geteilt werden. |
name | text | Es bestimmt den Namen für die gruppierten Elemente. Dieser Name wird im Browser nicht eingezeigt, es wird in der Arbeit von Skripten verwendet. |
Das Tag <fieldset> unterschtützt Globale Attribute und Globale Eventhandler.
Browser-Support
✓ | ✓ | ✓ | ✓ | ✓ |
Übe dein Wissen
Welche der folgenden Aussagen über das HTML-Tag <fieldset> sind korrekt?
Richtig!
Falsch!