Tag HTML <seleziona>
Esempio
Crea un elenco a discesa con quattro opzioni:
<label for="cars">Choose a car:</label>
<select
name="cars" id="cars">
<option value="volvo">Volvo</option>
<option value="saab">Saab</option>
<option value="mercedes">Mercedes</option>
<option value="audi">Audi</option>
</select>
Altri esempi "Provalo da solo" di seguito.
Definizione e utilizzo
L' <select>elemento viene utilizzato per creare un elenco a discesa.
L' <select>elemento viene spesso utilizzato in un modulo per raccogliere l'input dell'utente.
L' nameattributo è necessario per fare riferimento ai dati del modulo dopo che il modulo è stato inviato (se si omette l'
nameattributo, non verranno inviati dati dall'elenco a discesa).
L' idattributo è necessario per associare l'elenco a discesa a un'etichetta.
I tag <opzione> all'interno <select>dell'elemento definiscono le opzioni disponibili nell'elenco a discesa.
Suggerimento: aggiungi sempre il tag <label> per le migliori pratiche di accessibilità!
Supporto browser
| Element | |||||
|---|---|---|---|---|---|
| <select> | Yes | Yes | Yes | Yes | Yes |
Attributi
| Attribute | Value | Description |
|---|---|---|
| autofocus | autofocus | Specifies that the drop-down list should automatically get focus when the page loads |
| disabled | disabled | Specifies that a drop-down list should be disabled |
| form | form_id | Defines which form the drop-down list belongs to |
| multiple | multiple | Specifies that multiple options can be selected at once |
| name | name | Defines a name for the drop-down list |
| required | required | Specifies that the user is required to select a value before submitting the form |
| size | number | Defines the number of visible options in a drop-down list |
Attributi globali
Il <select>tag supporta anche gli attributi globali in HTML .
Attributi dell'evento
Il <select>tag supporta anche gli attributi dell'evento in HTML .
Altri esempi
Esempio
Usa <select> con i tag <optgroup>:
<label for="cars">Choose a car:</label>
<select
name="cars" id="cars">
<optgroup label="Swedish Cars">
<option value="volvo">Volvo</option>
<option value="saab">Saab</option>
</optgroup>
<optgroup label="German Cars">
<option value="mercedes">Mercedes</option>
<option value="audi">Audi</option>
</optgroup>
</select>
Pagine correlate
Riferimento HTML DOM: Seleziona Oggetto
Esercitazione CSS: stilizzazione dei moduli
Impostazioni CSS predefinite
Nessuno.