Formulare und untergliedertes Options-Menü

Beim dem Formularelement <select mit den verschiedenen Optionen können diese in Gruppen gegliedert werden. Dazu werden um die einzelnen Gruppen die Konstruktion <optgroup label=“Name“> und nach den einzelnen Optionen dann der End-TAG </optgroup>.

Im folgenden Beispiel sehen wir es bei ausgeklappten Menü (wird durch die Angabe size=““ bewirkt) und bei „gewohnter“ Ansicht.

Darüber kann eine übersichtliche Unterteilung der möglichen Auswahlen erfolgen. Die Überschriften der Unterteilung können nicht ausgewählt werden! Probieren Sie es.

Ausgeklappt:

gewohnte Ansicht:

Als Quellcode sieht es dann wie folgt aus:

<select name="untergliedertes_menu" size="12">
    <optgroup label="HTML lernen">
        <option value="html-aufbau">Aufbau HTML-Befehl</option>
        <option value="html-befehle">HTML-TAGs</option>
        <option value="html-attribute">Attribute</option>
    </optgroup>

    <optgroup label="CSS lernen">
        <option value="css-aufbau">Aufbau CSS-Befehl</option>
        <option value="css-befehle">wichtigsten CSS-Befehl</option>
    </optgroup>

    <optgroup label="JavaScript">
        <option value="js-aufbau">Aufbau JS-Befehl</option>
        <option value="js-aufruf">Aufruf</option>
        <option value="js-test">Testen</option>
        <option value="js-absichern">Absichern</option>
    </optgroup>
</select>

Felder von Formular zusammenfassen Reset-Button absichern

HTML5-Video-Kurs:
hier klicken für
mehr Informationen

weitere eigene Projekte:

Programmiersprachen

Bildbearbeitung & Fotografieren

MS Office Kurs / Ernährung