Выбор меню Bootstrap 5
- Предыдущая страница Bootstrap 5: формы
- Следующая страница Bootstrap 5: флажки и радиокнопки
Выбор меню
Выбор меню (выберите один пункт):
Многошаговое меню (удерживайте клавишу Ctrl или Shift (или перетащите мышью), чтобы выбрать несколько):
Если вы хотите позволить пользователям выбирать из нескольких вариантов, используйте список выбора.
Чтобы установить стили списка выбора в Bootstrap 5, установите .form-select
Добавьте класс к элементу <select>:
Пример
<select class="form-select"> <option>1</option> <option>2</option> <option>3</option> <option>4</option> </select>
Размер списка выбора
Используйте .form-select-lg
или .form-select-sm
Классы могут изменять размер списка выбора:
Пример
<select class="form-select form-select-lg"> <select class="form-select"> <select class="form-select form-select-sm">
Отключение списка выбора
Используйте disabled
Свойство отключения списка выбора
Пример
<select class="form-select" disabled> <option>1</option> <option>2</option> <option>3</option> <option>4</option> </select>
Список данных
Bootstrap позволяет также устанавливать стили для списков данных, которые являются предопределенным списком вариантов для элемента <input>:
Выберите ваш браузер из списка:
Пример
<label for="browser" class="form-label">Выберите ваш браузер из списка:</label> <input class="form-control" 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>
- Предыдущая страница Bootstrap 5: формы
- Следующая страница Bootstrap 5: флажки и радиокнопки