Bootstrap 5 Danh sách chọn
- Trang trước Form BS5
- Trang tiếp theo Kiểm tra hộp chọn và nút chọn BS5
Danh sách chọn
Chọn danh sách (chọn một mục):
Chọn danh sách (nhấn Ctrl hoặc Shift (hoặc kéo bằng chuột) để chọn nhiều mục):
Nếu bạn muốn cho phép người dùng chọn từ nhiều tùy chọn, hãy sử dụng menu chọn.
Nếu bạn muốn thiết lập phong cách menu chọn trong Bootstrap 5, hãy đặt .form-select
Lớp được thêm vào phần tử <select>:
Mô hình
<select class="form-select"> <option>1</option> <option>2</option> <option>3</option> <option>4</option> </select>
Kích thước của menu chọn
Vui lòng sử dụng .form-select-lg
hoặc .form-select-sm
Lớp để thay đổi kích thước menu chọn:
Mô hình
<select class="form-select form-select-lg"> <select class="form-select"> <select class="form-select form-select-sm">
Tắt menu chọn
Vui lòng sử dụng disabled
Thuộc tính tắt menu chọn:
Mô hình
<select class="form-select" disabled> <option>1</option> <option>2</option> <option>3</option> <option>4</option> </select>
Danh sách dữ liệu
Bootstrap còn có thể thiết lập phong cách cho danh sách dữ liệu, đó là danh sách tùy chọn được định nghĩa trước cho phần tử <input>:
Vui lòng chọn trình duyệt của bạn từ danh sách:
Mô hình
<label for="browser" class="form-label">Vui lòng chọn trình duyệt của bạn từ danh sách:</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>
- Trang trước Form BS5
- Trang tiếp theo Kiểm tra hộp chọn và nút chọn BS5