HTML Suchfelder – wie erstelle ich ein Suchfeld mit einer Auswahlliste?

von | Apr 13, 2023 | Allgemein | 1 Kommentar

Schlagwörter: HTML

Inhaltsverzeichnis

Ihr habt das sicher schon bei verschiedenen Formulare gesehen. Ihr habt ein Input Feld und wenn ihr was tippt, dann habt ihr bereits eine Liste wo ihr euer Suchbegriff auswählen könnt. Ihr dachtet jetzt sicher, das ist extrem kompliziertes Zeug dahinter, aber da irrt ihr euch. So ein Suchfeld mit einer Auswahlliste ist nämlich reines HTML und heute zeige ich euch wie ihr das selbst verwenden könnt.

Video

HTML

1
2
3
4
5
6
7
8
 <datalist id="stadt">
      <option value="Bern"></option>
      <option value="St. Gallen"></option>
      <option value="Luzern"></option>
      <option value="Basel"></option>
      <option value="Genf"></option>
    </datalist>
    <input list="stadt" type="search" placeholder="suche nach stadt" />

CSS

1
2
3
4
5
datalist {
        position: absolute;
        max-height: 20em;
        border: 0 none;
      }

1 Kommentar

  1. Fabian

    Danke hat sehr geholfen

    Antworten

Einen Kommentar abschicken

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert