Bootstrap 4 alert box message can be used for the purpose of creating immediate attention of the end-user with respect to success, warning, and error.
.alert
followed by one of the contextual
classes to the parent container.
.alert-success
,.alert-info
,.alert-warning
,.alert-danger
,.alert-primary
,.alert-secondary
,.alert-light
or .alert-dark
.
Note:Place .alert
followed by one of the contextual classes to the parent container of the alert box. Basically, contextual classes are used to provide different background colors to the alert box.
Note: Please keep in mind that contextual classes are used to provide a colored alert box.
Steps to create bootstrap 4 alert link:
.alert-link
class to any hyperlink base class.
alert-link
class to any hyperlink base class and add one of the contextual classes like: .alert-success
,.alert-info
,.alert-warning
,.alert-danger
,.alert-primary
,.alert-secondary
,alert-light
or .alert-dark
to parent(i.e div) class.
Note:You must have to provide a .alert-link
to the hyperlink base class.
.alert-dismissible
class to the
alert container
and then add .close
and data-dismiss="alert"
to a link or a button element.
Note: Bootstrap 4 close alert box has a close button. When a user clicks on the close button of the alert box the alert box will disappear from the web page.