Etiqueta HTML <opción>
Ejemplo
Una lista desplegable con cuatro opciones:
<label for="cars">Choose a car:</label>
<select id="cars">
<option value="volvo">Volvo</option>
<option value="saab">Saab</option>
<option value="opel">Opel</option>
<option value="audi">Audi</option>
</select>
Más ejemplos de "Pruébelo usted mismo" a continuación.
Definición y uso
La <option>etiqueta define una opción en una lista de selección.
<option>los elementos van dentro de un elemento <select> ,
<optgroup> o <datalist> .
Nota: La <option>etiqueta se puede usar sin ningún atributo, pero generalmente necesita el atributo de valor , que indica lo que se envía al servidor al enviar el formulario.
Sugerencia: si tiene una lista larga de opciones, puede agrupar las opciones relacionadas dentro de la etiqueta <optgroup> .
Compatibilidad con navegador
| Element | |||||
|---|---|---|---|---|---|
| <option> | Yes | Yes | Yes | Yes | Yes |
Atributos
| Attribute | Value | Description |
|---|---|---|
| disabled | disabled | Specifies that an option should be disabled |
| label | text | Specifies a shorter label for an option |
| selected | selected | Specifies that an option should be pre-selected when the page loads |
| value | text | Specifies the value to be sent to a server |
Atributos globales
La <option>etiqueta también es compatible con los atributos globales en HTML .
Atributos de eventos
La <option>etiqueta también es compatible con los atributos de eventos en HTML .
Más ejemplos
Ejemplo
Uso de <option> en un elemento <datalist>:
<label for="browser">Choose your browser from the list:</label>
<input list="browsers" name="browser" id="browser">
<datalist id="browsers">
<option value="Edge">
<option value="Firefox">
<option value="Chrome">
<option value="Opera">
<option value="Safari">
</datalist>
Ejemplo
Uso de <option> en elementos <optgroup>:
<label for="cars">Choose a car:</label>
<select 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>
páginas relacionadas
Referencia HTML DOM: Objeto de opción
Configuración predeterminada de CSS
Ninguna.