Auswahllisten unterteilen

Mit Hilfe eines HTML Tags kannst du kurzum wunderbar leicht Auswahllisten unterteilen. Durch den Einsatz von Zwischenüberschriften lässt sich daher die Übersichtlichkeit erhöhen. Das fördert schließlich die Lesbarkeit bei längeren Menüs.

In diesem Artikel zeige ich dir daher, wie das funktioniert.

 

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

Das folgende Beispiel macht von der Aufteilung her nicht viel Sinn, jedoch dient es gut der Veranschaulichung.

 

Auswahllisten unterteilen mit HTML

 


Live-Anzeigebeispiel:


 

Code:

<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>

Weitere Möglichkeiten

HTML und CSS bieten aber noch viele weitere Möglichkeiten, Listen zu erstellen und zu gestalten. Wenn du möchtest, kannst du dir daher den Artikel „Listen in HTML erstellen und gestalten“ ansehen. Dieser Artikel enthält weitere Tipps, was du mit Listen anstellen kannst.


Dir gefällt dieser Artikel?

Schreibe einen Kommentar

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