Button [A tag] Button [Button tag]
2- Outline buttons
Trong Bootstrap, mặc định các Button đều có mầu nền, nếu bạn muốn có một Button đơn giản, không mầu nền, hãy sử dụng các lớp .btn-outline-*.
outline buttons
Primary
Secondary
Success
Danger
Warning
Info
Light
Dark
3- Kích thước Button
Mặc định các Button trong Bootstrap có một kích thước vừa [Medium]. Sử dụng lớp .btn-sm nếu bạn muốn có Button kích thước nhỏ hơn, sử dụng lớp .btn-lg nếu bạn muốn có Button với kích thước lớn.
Small Size .btn-sm
Medium Size .btn-md [Default]
[Default]
Large Size .btn-lg
Lớp .btn-block giúp cho chiều rộng của Button lấp đầy [fill] chiều rộng của phần tử cha.
.btn-block
.btn-block
4- Trạng thái active & disabled
.active
Sử dụng lớp .active để làm cho một Button có trạng thái giống như nó đang được kích hoạt [active]. Với Bootstrap một Button ở trạng thái "active" sẽ có mầu đậm hơn so với chính nó khi ở trạng thái thông thường.
Bạn có thể xem hình dưới đây để xem sự khác biệt giữa một Button ở trạng thái kích hoạt và chính nó ở trạng thái thông thường:
.active
.btn-primary .active
.btn-primary
.btn-outline-primary .active
.btn-outline-primary
.btn-succes .active
.btn-succes
.btn-outline-success .active
.btn-outline-success
.disabled
Sử dụng lớp .disabled để vô hiệu hóa một Button, người dùng sẽ không thể tương tác với Button này.
.disabled
.btn-primary .disabled
.btn-primary
.btn-outline-primary .disabled
.btn-outline-primary
.btn-succes .disabled
.btn-succes
.btn-outline-success .disabled
.btn-outline-success