Auswahl-Listen unterteilen

Mit Hilfe eines HTML-Tags kann man Auswahl-Listen wunderbar leicht unterteilen. Durch den Einsatz von Zwischenüberschriften lässt sich die Übersichtlichkeit erhöhen. Das fördert die Lesbarkeit bei längeren Auswahl-Menüs.

In diesem Artikel zeige ich, wie das funktioniert.

 

Der dazu benötigte HTML-Tag ist der optgroup-Tag. Der Einsatz ist denkbar einfach und bietet in längeren Auswahllisten einen echten Mehrwert.

Das folgende Beispiel wird von seiner Aufteilung her nicht viel Sinn machen. Jedoch dient es gut der Veranschaulichung.

 


Live-Anzeigebeispiel:


 

Quellcode:

<form>
<select name="auswahl">
<optgroup label="Städte">
<option value="berlin">Berlin</option>
<option value="hamburg">Hamburg</option>
<option value="münchen">München</option>
</optgroup>
<optgroup label="Bundesländer">
<option value="nrw">NRW</option>
<option value="bayern">Bayern</option>
<option value="thüringen">Thüringen</option>
</optgroup>
<optgroup label="Auto-Hersteller">
<option value="audi">Audi</option>
<option value="opel">Opel</option>
<option value="bmw">BMW</option>
</optgroup>
</select>
</form>

 


Dir gefällt dieser Artikel?

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht.