Nút khởi động 3

Sử dụng các kiểu nút tùy chỉnh Bootstrap, cho các hành động trong các biểu mẫu, hộp thoại và nhiều hơn nữa với sự hỗ trợ cho nhiều kích thước, trạng thái và hơn thế nữa

Nội dung chính Hiển thị

• Các nút thảo luận
• Size
• Trạng thái tích cực
• Trạng thái vô hiệu hóa
• nút plugin
• Chuyển đổi trạng thái
• Hộp kiểm và các nút radio
• Phương pháp
• Các kiểu nút khác nhau trong bootstrap là gì?
• Những điều sau đây là sử dụng các nút điều chỉnh bootstrap?
• Chúng ta có thể thay đổi màu nút bootstrap không?
• Có bao nhiêu loại nút trong bootstrap?

Nội dung chính Hiển thị Hiển thị

• Các nút thảo luận
• Size
• Trạng thái tích cực
• Trạng thái vô hiệu hóa
• nút plugin
• Chuyển đổi trạng thái
• Hộp kiểm và các nút radio
• Phương pháp
• Các kiểu nút khác nhau trong bootstrap là gì?
• Những điều sau đây là sử dụng các nút điều chỉnh bootstrap?
• Chúng ta có thể thay đổi màu nút bootstrap không?
• Có bao nhiêu loại nút trong bootstrap?

Ví dụ

Bootstrap bao gồm một số kiểu nút đã được xác định trước, mỗi kiểu phục vụ có mục đích theo nghĩa của riêng mình, với một vài tính năng bổ sung để kiểm tra nhiều hơn

 type="button" class="btn btn-primary">Primary
 type="button" class="btn btn-secondary">Secondary
 type="button" class="btn btn-success">Success
 type="button" class="btn btn-danger">Danger
 type="button" class="btn btn-warning">Warning
 type="button" class="btn btn-info">Info
 type="button" class="btn btn-light">Light
 type="button" class="btn btn-dark">Dark

 type="button" class="btn btn-link">Link

Truyền đạt ý nghĩa để hỗ trợ các công nghệ

Sử dụng màu sắc để bổ sung ý nghĩa chỉ cung cấp một dấu hiệu trực quan, sẽ không được chuyển đến người sử dụng các công nghệ hỗ trợ - chẳng hạn như đầu đọc màn hình. Đảm bảo rằng thông tin được biểu thị bằng màu rõ ràng từ nội dung chính (ví dụ. văn bản có thể nhìn thấy) hoặc được bao gồm thông qua các phương tiện tiện ích thay thế, chẳng hạn như văn bản bổ sung ẩn với lớp

 class="btn btn-primary" href="#" role="button">Link
 class="btn btn-primary" type="submit">Button
 class="btn btn-primary" type="button" value="Input">
 class="btn btn-primary" type="submit" value="Submit">
 class="btn btn-primary" type="reset" value="Reset">

2

Các lớp

 class="btn btn-primary" href="#" role="button">Link
 class="btn btn-primary" type="submit">Button
 class="btn btn-primary" type="button" value="Input">
 class="btn btn-primary" type="submit" value="Submit">
 class="btn btn-primary" type="reset" value="Reset">

3 được thiết kế để sử dụng với phần tử

 class="btn btn-primary" href="#" role="button">Link
 class="btn btn-primary" type="submit">Button
 class="btn btn-primary" type="button" value="Input">
 class="btn btn-primary" type="submit" value="Submit">
 class="btn btn-primary" type="reset" value="Reset">

4. Tuy nhiên, bạn cũng có thể sử dụng các lớp này trên các phần tử ___15 hoặc

 class="btn btn-primary" href="#" role="button">Link
 class="btn btn-primary" type="submit">Button
 class="btn btn-primary" type="button" value="Input">
 class="btn btn-primary" type="submit" value="Submit">
 class="btn btn-primary" type="reset" value="Reset">

6 (mặc dù một số trình duyệt có thể áp dụng một kết quả hơi khác)

Khi sử dụng các nút lớp trên các phần tử

 class="btn btn-primary" href="#" role="button">Link
 class="btn btn-primary" type="submit">Button
 class="btn btn-primary" type="button" value="Input">
 class="btn btn-primary" type="submit" value="Submit">
 class="btn btn-primary" type="reset" value="Reset">

5 được sử dụng để kích hoạt chức năng trong trang (như nội dung sụp đổ), thay vì liên kết với các trang hoặc phần mới trong trang hiện tại, các liên kết này phải được cung cấp một cách thích hợp để truyền đạt mục .

 class="btn btn-primary" href="#" role="button">Link
 class="btn btn-primary" type="submit">Button
 class="btn btn-primary" type="button" value="Input">
 class="btn btn-primary" type="submit" value="Submit">
 class="btn btn-primary" type="reset" value="Reset">

Các nút thảo luận

Cần một nút, nhưng không phải là màu nền để chúng mang lại?