Bootstrap nút chưa được tạo kiểu

Chúng được sử dụng cho các mục đích khác nhau như, gửi hoặc đặt lại biểu mẫu HTML, thực hiện các hành động tương tác như hiển thị hoặc ẩn thứ gì đó trên trang web khi nhấp vào nút, chuyển hướng người dùng đến một trang . v

Bootstrap cung cấp một cách nhanh chóng và dễ dàng để tạo và tùy chỉnh các nút

Các kiểu nút trong Bootstrap

Các lớp khác nhau có sẵn trong Bootstrap để tạo kiểu cho các nút cũng như biểu thị các trạng thái hoặc ngữ nghĩa khác nhau. Các loại nút có thể được áp dụng cho bất kỳ phần tử nào. Tuy nhiên, nó thường được áp dụng cho các phần tử

Primary
Secondary
Success
Danger
Warning
Info
Dark
Light

Primary
Secondary
Success
Danger
Warning
Info
Dark
Light

Ví dụ sau sẽ chỉ cho bạn cách tạo các kiểu nút khác nhau trong Bootstrap

Primary
Secondary
Success
Danger
Warning
Info
Dark
Light

Kết quả của ví dụ trên sẽ giống như sau

Các kiểu nút viền trong Bootstrap

Bạn cũng có thể tạo các nút viền bằng cách thay thế các lớp bổ trợ kiểu nút trong Bootstrap, như sau

Primary
Secondary
Success
Danger
Warning
Info
Dark
Light

Kết quả của ví dụ trên sẽ giống như sau

Thay đổi kích thước của các nút

Bootstrap cung cấp cho bạn thêm tùy chọn để tăng hoặc giảm kích thước của nút

Để làm cho các nút lớn hơn, hãy thêm một lớp bổ sung

Primary
Secondary
Success
Danger
Warning
Info
Dark
Light

Large button
Large button

Kết quả của ví dụ trên sẽ giống như sau

Tương tự, để làm cho các nút nhỏ hơn, hãy thêm một lớp bổ sung

Primary
Secondary
Success
Danger
Warning
Info
Dark
Light

Kết quả của ví dụ trên sẽ giống như sau

Bạn cũng có thể tạo các nút có chiều rộng đầy đủ hoặc các khối nút [các nút bao phủ toàn bộ chiều rộng của các phần tử cha] thông qua việc sử dụng các lớp tiện ích khoảng trống và hiển thị của Bootstrap

Những tiện ích này cung cấp khả năng kiểm tra giám sát tốt hơn nhiều đối với khoảng cách, căn chỉnh và các hành vi trả lời

    Block button
    Block button

Kết quả của ví dụ trên sẽ giống như sau

Bạn cũng có thể tạo biến thể trả lời câu hỏi của các nút này bằng cách sử dụng các lớp

Primary
Secondary
Success
Danger
Warning
Info
Dark
Light

Trong ví dụ sau, các nút sẽ được xếp chồng lên nhau theo chiều dọc trên các thiết bị nhỏ và cực nhỏ [tức là chiều rộng khung nhìn