Heim  >  Artikel  >  Web-Frontend  >  Detaillierte Erläuterung des Grafikcodes für die Dropdown-Listenauswahl in HTML

Detaillierte Erläuterung des Grafikcodes für die Dropdown-Listenauswahl in HTML

黄舟
黄舟Original
2017-07-26 09:53:573416Durchsuche

Dropdown-Liste in HTML:

HTML-Code Detaillierte Erläuterung des Grafikcodes für die Dropdown-Listenauswahl in HTML

<select>  
  <option value ="1">Volvo</option>  
  <option value ="2">Saab</option>  
  <option value="3">Opel</option>  
  <option value="4">Audi</option>  
</select>

Unter Bei ihnen bedeutet „Auswählen“ die Anzeige einer Dropdown-Liste (Dropdown-Liste), „Option“ ist das Element in der Dropdown-Liste und der Textinhalt der Option ist der auf der Seite im Dropdown-Listenelement angezeigte Wert Der Wert ist der tatsächlich benötigte Wert, der an den Server übermittelt wird.
Der Anzeigeeffekt ist wie folgt:


Komplexere Dropdown-Liste:

Html-Code Detaillierte Erläuterung des Grafikcodes für die Dropdown-Listenauswahl in HTML

<select>  
  <optgroup label="Swedish Cars">  
    <option value="1">Volvo</option>  
    <option value="2">Saab</option>  
  </optgroup>  
  <optgroup label="German Cars">  
    <option value="3">Mercedes</option>  
    <option value="4">Audi</option>  
  </optgroup>  
</select>

Diese Dropdown-Liste enthält eine „Artikelgruppe“, diese Gruppe ist Wenn Sie keine Auswahl haben, verwenden Sie das Label-Tag, um den wörtlichen Inhalt zu markieren. Was wirklich funktioniert, ist das Wertattribut.
Sehen Sie sich diese Dropdown-Liste mit „Projektgruppe“ an


Parameter in Option: ausgewählt ="ausgewählt"
Wenn Sie die Seite öffnen müssen, wird standardmäßig eine Option ausgewählt. Sie müssen den ausgewählten Parameter verwenden:

Html-Code Detaillierte Erläuterung des Grafikcodes für die Dropdown-Listenauswahl in HTML

<select>  
  <option value="1">Volvo</option>  
  <option value="2">Saab</option>  
  <option value="3" selected="selected">Mercedes</option>  
  <option value="4">Audi</option>  
</select>

Parameter in Option: deaktiviert="disabled"
Wenn Sie ein Element deaktivieren müssen, es aber nicht ausblenden möchten, können Sie es verwenden das deaktivierte Attribut

Html-Code Detaillierte Erläuterung des Grafikcodes für die Dropdown-Listenauswahl in HTML

<select>  
  <option value="1">Volvo</option>  
  <option value="2">Saab</option>  
  <option value="3" disabled="disabled">Mercedes</option>  
  <option value="4">Audi</option>  
</select>

Parameter in Option: Titel
Wenn Sie die Maus platzieren müssen, wenn Sie zu einem bestimmten Projekt gehen, können Sie das Titelattribut

Html-Code Detaillierte Erläuterung des Grafikcodes für die Dropdown-Listenauswahl in HTML

<select>  
  <option value="1">Volvo</option>  
  <option value="2">Saab</option>  
  <option value="3">Mercedes</option>  
  <option value="4" title="Audi, your best choice!">Audi</option>  
</select>

Tatsächlich kann der Titel auch in vielen anderen HTML-Tags verwendet werden!

Das obige ist der detaillierte Inhalt vonDetaillierte Erläuterung des Grafikcodes für die Dropdown-Listenauswahl in HTML. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn