Hướng dẫn alert bootstrap 4 - cảnh báo bootstrap 4

  This is a primary alert—check it out!

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

Sử dụng màu sắc để thêm ý nghĩa chỉ cung cấp một dấu hiệu trực quan, sẽ không được chuyển đến người 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 là rõ ràng từ chính nội dung [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 thay thế, chẳng hạn như văn bản bổ sung ẩn với lớp .sr-only.

Màu sắc liên kết

Sử dụng lớp tiện ích

  This is a primary alert with an example link. Give it a click if you like.


  This is a secondary alert with an example link. Give it a click if you like.


  This is a success alert with an example link. Give it a click if you like.


  This is a danger alert with an example link. Give it a click if you like.


  This is a warning alert with an example link. Give it a click if you like.


  This is a info alert with an example link. Give it a click if you like.


  This is a light alert with an example link. Give it a click if you like.


  This is a dark alert with an example link. Give it a click if you like.

  This is a primary alert with an example link. Give it a click if you like.


  This is a secondary alert with an example link. Give it a click if you like.


  This is a success alert with an example link. Give it a click if you like.


  This is a danger alert with an example link. Give it a click if you like.


  This is a warning alert with an example link. Give it a click if you like.


  This is a info alert with an example link. Give it a click if you like.


  This is a light alert with an example link. Give it a click if you like.


  This is a dark alert with an example link. Give it a click if you like.

Nội dung bổ sung

Cảnh báo cũng có thể chứa các yếu tố HTML bổ sung như tiêu đề, đoạn văn và bộ chia.

  Well done!
  
Aww yeah, you successfully read this important alert message. This example text is going to run a bit longer so that you can see how spacing within an alert works with this kind of content.
  
  Whenever you need to, be sure to use margin utilities to keep things nice and tidy.

Gạt bỏ

Sử dụng plugin JavaScript cảnh báo, nó có thể loại bỏ bất kỳ cảnh báo nào. Đây là cách: làm thế nào:

• Hãy chắc chắn rằng bạn đã tải plugin cảnh báo hoặc bootstrap được biên dịch JavaScript.
• Nếu bạn đang xây dựng JavaScript của chúng tôi từ nguồn, nó yêu cầu

  
    This is a primary alert with an example link. Give it a click if you like.
  
  
    This is a secondary alert with an example link. Give it a click if you like.
  
  
    This is a success alert with an example link. Give it a click if you like.
  
  
    This is a danger alert with an example link. Give it a click if you like.
  
  
    This is a warning alert with an example link. Give it a click if you like.
  
  
    This is a info alert with an example link. Give it a click if you like.
  
  
    This is a light alert with an example link. Give it a click if you like.
  
  
    This is a dark alert with an example link. Give it a click if you like.
  

  1. Phiên bản biên dịch bao gồm điều này.
• Thêm một nút DISMISS và lớp

  
    This is a primary alert with an example link. Give it a click if you like.
  
  
    This is a secondary alert with an example link. Give it a click if you like.
  
  
    This is a success alert with an example link. Give it a click if you like.
  
  
    This is a danger alert with an example link. Give it a click if you like.
  
  
    This is a warning alert with an example link. Give it a click if you like.
  
  
    This is a info alert with an example link. Give it a click if you like.
  
  
    This is a light alert with an example link. Give it a click if you like.
  
  
    This is a dark alert with an example link. Give it a click if you like.
  

  2, thêm phần đệm vào bên phải của cảnh báo và định vị nút

  
    This is a primary alert with an example link. Give it a click if you like.
  
  
    This is a secondary alert with an example link. Give it a click if you like.
  
  
    This is a success alert with an example link. Give it a click if you like.
  
  
    This is a danger alert with an example link. Give it a click if you like.
  
  
    This is a warning alert with an example link. Give it a click if you like.
  
  
    This is a info alert with an example link. Give it a click if you like.
  
  
    This is a light alert with an example link. Give it a click if you like.
  
  
    This is a dark alert with an example link. Give it a click if you like.
  

  3.
• Trên nút DISMISS, thêm thuộc tính

  
    This is a primary alert with an example link. Give it a click if you like.
  
  
    This is a secondary alert with an example link. Give it a click if you like.
  
  
    This is a success alert with an example link. Give it a click if you like.
  
  
    This is a danger alert with an example link. Give it a click if you like.
  
  
    This is a warning alert with an example link. Give it a click if you like.
  
  
    This is a info alert with an example link. Give it a click if you like.
  
  
    This is a light alert with an example link. Give it a click if you like.
  
  
    This is a dark alert with an example link. Give it a click if you like.
  

  4, kích hoạt chức năng JavaScript. Hãy chắc chắn sử dụng phần tử

  
    This is a primary alert with an example link. Give it a click if you like.
  
  
    This is a secondary alert with an example link. Give it a click if you like.
  
  
    This is a success alert with an example link. Give it a click if you like.
  
  
    This is a danger alert with an example link. Give it a click if you like.
  
  
    This is a warning alert with an example link. Give it a click if you like.
  
  
    This is a info alert with an example link. Give it a click if you like.
  
  
    This is a light alert with an example link. Give it a click if you like.
  
  
    This is a dark alert with an example link. Give it a click if you like.
  

  5 với nó cho hành vi thích hợp trên tất cả các thiết bị.
• Để có các cảnh báo kích thích khi loại bỏ chúng, hãy chắc chắn thêm các lớp

  
    This is a primary alert with an example link. Give it a click if you like.
  
  
    This is a secondary alert with an example link. Give it a click if you like.
  
  
    This is a success alert with an example link. Give it a click if you like.
  
  
    This is a danger alert with an example link. Give it a click if you like.
  
  
    This is a warning alert with an example link. Give it a click if you like.
  
  
    This is a info alert with an example link. Give it a click if you like.
  
  
    This is a light alert with an example link. Give it a click if you like.
  
  
    This is a dark alert with an example link. Give it a click if you like.
  

  6 và

  
    This is a primary alert with an example link. Give it a click if you like.
  
  
    This is a secondary alert with an example link. Give it a click if you like.
  
  
    This is a success alert with an example link. Give it a click if you like.
  
  
    This is a danger alert with an example link. Give it a click if you like.
  
  
    This is a warning alert with an example link. Give it a click if you like.
  
  
    This is a info alert with an example link. Give it a click if you like.
  
  
    This is a light alert with an example link. Give it a click if you like.
  
  
    This is a dark alert with an example link. Give it a click if you like.
  

  7.

Bạn có thể thấy điều này trong hành động với bản demo trực tiếp:

  Holy guacamole! You should check in on some of those fields below.
  
    ×
  

Hành vi JavaScript

Gây nên

Bật việc bác bỏ cảnh báo thông qua JavaScript:

$['.alert'].alert[]

Hoặc với các thuộc tính

  This is a primary alert with an example link. Give it a click if you like.


  This is a secondary alert with an example link. Give it a click if you like.


  This is a success alert with an example link. Give it a click if you like.


  This is a danger alert with an example link. Give it a click if you like.


  This is a warning alert with an example link. Give it a click if you like.


  This is a info alert with an example link. Give it a click if you like.


  This is a light alert with an example link. Give it a click if you like.


  This is a dark alert with an example link. Give it a click if you like.

  ×

Lưu ý rằng việc đóng một cảnh báo sẽ loại bỏ nó khỏi DOM.

Phương pháp

  This is a primary alert with an example link. Give it a click if you like.


  This is a secondary alert with an example link. Give it a click if you like.


  This is a success alert with an example link. Give it a click if you like.


  This is a danger alert with an example link. Give it a click if you like.


  This is a warning alert with an example link. Give it a click if you like.


  This is a info alert with an example link. Give it a click if you like.


  This is a light alert with an example link. Give it a click if you like.


  This is a dark alert with an example link. Give it a click if you like.

  This is a primary alert with an example link. Give it a click if you like.


  This is a secondary alert with an example link. Give it a click if you like.


  This is a success alert with an example link. Give it a click if you like.


  This is a danger alert with an example link. Give it a click if you like.


  This is a warning alert with an example link. Give it a click if you like.


  This is a info alert with an example link. Give it a click if you like.


  This is a light alert with an example link. Give it a click if you like.


  This is a dark alert with an example link. Give it a click if you like.

  Well done!
  
Aww yeah, you successfully read this important alert message. This example text is going to run a bit longer so that you can see how spacing within an alert works with this kind of content.

  


  
  Whenever you need to, be sure to use margin utilities to keep things nice and tidy.

  This is a primary alert with an example link. Give it a click if you like.


  This is a secondary alert with an example link. Give it a click if you like.


  This is a success alert with an example link. Give it a click if you like.


  This is a danger alert with an example link. Give it a click if you like.


  This is a warning alert with an example link. Give it a click if you like.


  This is a info alert with an example link. Give it a click if you like.


  This is a light alert with an example link. Give it a click if you like.


  This is a dark alert with an example link. Give it a click if you like.

  This is a primary alert with an example link. Give it a click if you like.


  This is a secondary alert with an example link. Give it a click if you like.


  This is a success alert with an example link. Give it a click if you like.


  This is a danger alert with an example link. Give it a click if you like.


  This is a warning alert with an example link. Give it a click if you like.


  This is a info alert with an example link. Give it a click if you like.


  This is a light alert with an example link. Give it a click if you like.


  This is a dark alert with an example link. Give it a click if you like.

  Well done!
  
Aww yeah, you successfully read this important alert message. This example text is going to run a bit longer so that you can see how spacing within an alert works with this kind of content.
  
  Whenever you need to, be sure to use margin utilities to keep things nice and tidy.

$[".alert"].alert['close']

Sự kiện

Plugin cảnh báo Bootstrap, hiển thị một vài sự kiện để kết nối với chức năng cảnh báo.

  This is a primary alert with an example link. Give it a click if you like.


  This is a secondary alert with an example link. Give it a click if you like.


  This is a success alert with an example link. Give it a click if you like.


  This is a danger alert with an example link. Give it a click if you like.


  This is a warning alert with an example link. Give it a click if you like.


  This is a info alert with an example link. Give it a click if you like.


  This is a light alert with an example link. Give it a click if you like.


  This is a dark alert with an example link. Give it a click if you like.

  This is a primary alert with an example link. Give it a click if you like.


  This is a secondary alert with an example link. Give it a click if you like.


  This is a success alert with an example link. Give it a click if you like.


  This is a danger alert with an example link. Give it a click if you like.


  This is a warning alert with an example link. Give it a click if you like.


  This is a info alert with an example link. Give it a click if you like.


  This is a light alert with an example link. Give it a click if you like.


  This is a dark alert with an example link. Give it a click if you like.

  Well done!
  
Aww yeah, you successfully read this important alert message. This example text is going to run a bit longer so that you can see how spacing within an alert works with this kind of content.
  
  Whenever you need to, be sure to use margin utilities to keep things nice and tidy.

  This is a primary alert with an example link. Give it a click if you like.


  This is a secondary alert with an example link. Give it a click if you like.


  This is a success alert with an example link. Give it a click if you like.


  This is a danger alert with an example link. Give it a click if you like.


  This is a warning alert with an example link. Give it a click if you like.


  This is a info alert with an example link. Give it a click if you like.


  This is a light alert with an example link. Give it a click if you like.


  This is a dark alert with an example link. Give it a click if you like.

  This is a primary alert with an example link. Give it a click if you like.


  This is a secondary alert with an example link. Give it a click if you like.


  This is a success alert with an example link. Give it a click if you like.


  This is a danger alert with an example link. Give it a click if you like.


  This is a warning alert with an example link. Give it a click if you like.


  This is a info alert with an example link. Give it a click if you like.


  This is a light alert with an example link. Give it a click if you like.


  This is a dark alert with an example link. Give it a click if you like.

$['#myAlert'].on['closed.bs.alert', function [] {
  // do something…
}]