Etiqueta HTML <seleccionar>
Ejemplo
Cree una lista desplegable con cuatro opciones:
<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>
Más ejemplos de "Pruébelo usted mismo" a continuación.
Definición y uso
El <select>elemento se utiliza para crear una lista desplegable.
El <select>elemento se usa con mayor frecuencia en un formulario, para recopilar la entrada del usuario.
El nameatributo es necesario para hacer referencia a los datos del formulario después de enviar el formulario (si omite el
nameatributo, no se enviará ningún dato de la lista desplegable).
El idatributo es necesario para asociar la lista desplegable con una etiqueta.
Las etiquetas <option><select> dentro del elemento definen las opciones disponibles en la lista desplegable.
Sugerencia: ¡ Agregue siempre la etiqueta <label> para conocer las mejores prácticas de accesibilidad!
Compatibilidad con navegador
| Element | |||||
|---|---|---|---|---|---|
| <select> | Yes | Yes | Yes | Yes | Yes |
Atributos
| 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 |
Atributos globales
La <select>etiqueta también es compatible con los atributos globales en HTML .
Atributos de eventos
La <select>etiqueta también es compatible con los atributos de eventos en HTML .
Más ejemplos
Ejemplo
Use <select> con etiquetas <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>
páginas relacionadas
Referencia HTML DOM: seleccionar objeto
Tutorial de CSS: formularios de estilo
Configuración predeterminada de CSS
Ninguna.