Summary  
This chapter explains how to implement dropdown menus using the HTML `<select>` element—defining individual choices with `<option>`, grouping them with `<optgroup>`, and customizing behavior via attributes like `name`, `size`, `multiple`, `disabled`, and `selected`.  

General domain of usage  
Web forms

Das `<select>`-Element wird verwendet, um eine Dropdown-Liste mit Auswahlmöglichkeiten für den Benutzer zu erstellen. Es kommt typischerweise in Formularen zum Einsatz, in denen der Benutzer aus einer vordefinierten Auswahl wählen muss.
Es wird immer in Verbindung mit `<option>`-Elementen verwendet. Die `<option>`-Elemente definieren die einzelnen Einträge in der Dropdown-Liste.

PGZvcm0gb25zdWJtaXQ9InJldHVybiBmYWxzZSI+CiAgPHNlbGVjdD4KICAgIDxvcHRpb24gdmFsdWU9InRvbWF0byI+dG9tYXRvPC9vcHRpb24+CiAgICA8b3B0aW9uIHZhbHVlPSJjdWN1bWJlciI+Y3VjdW1iZXI8L29wdGlvbj4KICAgIDxvcHRpb24gdmFsdWU9ImxldHR1Y2UiPmxldHR1Y2U8L29wdGlvbj4KICA8L3NlbGVjdD4KICA8YnV0dG9uIHR5cGU9InN1Ym1pdCI+U3VibWl0PC9idXR0b24+CjwvZm9ybT4=

Das `<select>`-Element verfügt außerdem über mehrere Attribute, mit denen sein Verhalten angepasst werden kann, darunter:

- `name`: Der Name des Select-Elements, der beim Absenden des Formulars verwendet wird;
- `size`: Die Anzahl der sichtbaren Optionen in der Dropdown-Liste;
- `multiple`: Falls vorhanden, ermöglicht es dem Benutzer, mehrere Optionen auszuwählen;
- `disabled`: Falls vorhanden, wird das Select-Element deaktiviert.

Um eine Liste in separate, unabhängige Gruppen zu unterteilen, kann das `<optgroup>`-Tag verwendet werden. Das Attribut `label` weist der Gruppe einen Titel zu.

PGZvcm0gb25zdWJtaXQ9InJldHVybiBmYWxzZSI+CiAgPGxhYmVsIGZvcj0ic3BvcnQiPkZhdm9yaXRlIFNwb3J0PC9sYWJlbD4KICA8c2VsZWN0IG5hbWU9InNwb3J0IiBpZD0ic3BvcnQiPgogICAgPG9wdGdyb3VwIGxhYmVsPSJUZWFtIHNwb3J0Ij4KICAgICAgPG9wdGlvbiB2YWx1ZT0ic29jY2VyIj5zb2NjZXI8L29wdGlvbj4KICAgICAgPG9wdGlvbiB2YWx1ZT0iYmFza2V0YmFsbCI+YmFza2V0YmFsbDwvb3B0aW9uPgogICAgICA8b3B0aW9uIHZhbHVlPSJob2NrZXkiPmhvY2tleTwvb3B0aW9uPgogICAgPC9vcHRncm91cD4KCiAgICA8b3B0Z3JvdXAgbGFiZWw9IkluZGl2aWR1YWwgc3BvcnQiPgogICAgICA8b3B0aW9uIHZhbHVlPSJib3hpbmciPmJveGluZzwvb3B0aW9uPgogICAgICA8b3B0aW9uIHZhbHVlPSJzd2ltbWluZyI+c3dpbW1pbmc8L29wdGlvbj4KICAgICAgPG9wdGlvbiB2YWx1ZT0ic2tpaW5nIj5za2lpbmc8L29wdGlvbj4KICAgIDwvb3B0Z3JvdXA+CiAgPC9zZWxlY3Q+CiAgPGJ1dHRvbiB0eXBlPSJzdWJtaXQiPlN1Ym1pdDwvYnV0dG9uPgo8L2Zvcm0+

> Hinweis
>
> Standardmäßig wird das erste `<option>`-Element in der Liste ausgewählt. Um dies zu ändern, kann das Attribut `selected` zu einem beliebigen `<option>`-Element hinzugefügt werden.

Was ist die Hauptfunktion des `<select>`-Elements in HTML?

Erlernen Sie die Grundlagen von HTML (HyperText Markup Language), dem Fundament der Webentwicklung. Dieser einsteigerfreundliche Kurs behandelt Tags, Attribute, Elemente und die Strukturierung von Webseiten. Erwerben Sie praktische Fähigkeiten im Erstellen von Überschriften, Absätzen, Listen, Bildern, Links, Formularen und Tabellen. Entdecken Sie Best Practices, Optimierung und Webzugänglichkeit. Beginnen Sie Ihre Webentwicklungsreise mit HTML.

Erkunden Sie die Funktionsweise des Webs. Erfahren Sie, wie Daten über Netzwerke übertragen werden, entdecken Sie die Rolle von Protokollen und entschlüsseln Sie die Geheimnisse von IP-Adressen und Domainnamen. Gewinnen Sie ein grundlegendes Verständnis darüber, wie Webbrowser und Server miteinander kommunizieren, um Webinhalte bereitzustellen.

Erkunden Sie die Möglichkeiten von Tags zur Strukturierung von Inhalten, von Überschriften und Absätzen bis hin zu Listen und Tabellen. Erfahren Sie, wie Sie Elemente mit Attributen erweitern können.

Der Kern der HTML-Dokumentstruktur. Lernen Sie die Bestandteile eines HTML-Dokuments kennen, einschließlich der Doctype-Deklaration, des Head- und Body-Bereichs. Verstehen Sie den Zweck jedes Elements und wie sie zur Gesamtstruktur einer Webseite beitragen.

Gestaltung einer ansprechenderen Webseite durch den Einsatz von Medien wie Bildern, Audio und Video. Umgang mit strukturierten tabellarischen Daten in Form von Tabellen.

Erkunden Sie die Vielseitigkeit von HTML-Formularen. Lernen Sie, intuitive und benutzerfreundliche Formulare durch Anwendung zentraler Konzepte und Techniken zu gestalten. Entdecken Sie, wie Formulare die Benutzerinteraktion und Datenübermittlung auf Websites ermöglichen.

Verwendung des Select-Elements für Dropdown-Menüs

Awesome!

Verwendung des Select-Elements für Dropdown-Menüs