Alerts
Examples
Alerts are available for any length of text,as well as an optional dismiss button. For proper styling,use one of the four requiredcontextual classes(e.g.,.alert-success
). For inline dismissal,use the alerts jQuery plugin.
A simple primary alert
A simple success alert
A simple info alert
A simple warning alert
A simple danger alert
Link color
Use the .alert-link
utility class to quickly provide matching colored links within any alert.
A simple primary alert with an example link. Give it a click if you like.
A simple success alert with an example link. Give it a click if you like.
A simple info alert with an example link. Give it a click if you like.
A simple warning alert with an example link. Give it a click if you like.
A simple danger alert with an example link. Give it a click if you like.
Dismissing
You can see this in action with a live demo:
Well done!You successfully read this important alert message.
Heads up!This alert needs your attention,but it's not super important.
Warning! Better check yourself, you're not looking too good.
Oh snap!Change a few things up and try submitting again.
Additional content
Alerts can also contain additional HTML elements like headings and paragraphs.
Success Alert
Well done!
Placed your Order successfully
Danger Alert
Something went wrong
Sorry!Product not available