Menú desplegable Bootstrap5
El menú desplegable puede ser un menú desplegable de selección única o un menú desplegable de selección múltiple.
Menú desplegable de selección única:
Menú desplegable de selección múltiple:
En Bootstrap5, el menú desplegable<select>los elementos pueden usar.form-selectclase para renderizar:
Ejemplo
<select class="form-select">
<option>1</option>
<option>2</option>
<option>3</option>
<option>4</option>
</select>
Pruébalo »
El menú desplegable a través de.form-select-lgo.form-select-smclase para modificar el tamaño:
Ejemplo
<select class="form-select form-select-lg">
<select class="form-select">
<select class="form-select form-select-sm">
Pruébalo »
El resultado se muestra a continuación:
disabledEl atributo puede deshabilitar la selección del menú desplegable:
Ejemplo
<select class="form-select" disabled>
<option>1</option>
<option>2</option>
<option>3</option>
<option>4</option>
</select>
Pruébalo »
Lista de datos
Bootstrap también puede configurar un menú desplegable para el elemento <input> mediante la etiqueta datalist:
El siguiente ejemplo selecciona un sitio web de la lista:
Ejemplo
<label for="browser" class="form-label">Selecciona tu sitio web favorito:</label>
<input class="form-control" list="sites" name="site" id="site">
<datalist id="sites">
<option value="Google">
<option value="Ejemplo">
<option value="Taobao">
<option value="Wiki">
<option value="Zhihu">
</datalist>
Pruébalo »
El resultado se muestra a continuación:
