Alerts are available for any length of text, as well as an optional dismiss button. For proper styling, use one of the four required contextual classes (e.g., .alert-success)

Success! Well done its submitted.
Info! take this info.
Warning ! Dont submit this.
Error ! Change few things.

Add the alert-link class to any links inside the alert
box to create "matching
colored links":

close the success message, add a .alert-dismissible class to the alert container. Then add class="close" and data-dismiss="alert" to a link or a button element (when you click on this the alert box.

Success Message

You successfully read this important alert message.

close the info message, add a .alert-dismissible class to the alert container. Then add class="close" and data-dismiss="alert" to a link or a button element (when you click on this the alert box.

Info Message

This alert needs your attention, but it's not super important.

close the warning message, add a .alert-dismissible class to the alert container. Then add class="close" and data-dismiss="alert" to a link or a button element (when you click on this the alert box.

Warning Message

Best check yo self, you're not looking too good.

close the danger message, add a .alert-dismissible class to the alert container. Then add class="close" and data-dismiss="alert" to a link or a button element (when you click on this the alert box.

Danger Message

Change a few things up and try submitting again.

Alerts can also contain additional HTML elements like headings
and paragraphs.

loader