<div class="alert alert-primary" role="alert">
	  This is a primary alert—check it out!
	</div>
	<div class="alert alert-secondary" role="alert">
	  This is a secondary alert—check it out!
	</div>
	<div class="alert alert-success" role="alert">
	  This is a success alert—check it out!
	</div>

	<!--Link Color< -->
	<div class="alert alert-warning" role="alert">
	  This is a warning alert with <a href="#" class="alert-link">an example link</a>. Give it a click if you like.
	</div>
	<div class="alert alert-info" role="alert">
	  This is a info alert with <a href="#" class="alert-link">an example link</a>. Give it a click if you like.
	</div>
	<div class="alert alert-light" role="alert">
	  This is a light alert with <a href="#" class="alert-link">an example link</a>. Give it a click if you like.
	</div>

	<!--Additional Content< -->
	<div class="alert alert-success" role="alert">
	  <h4 class="alert-heading ">Well done!</h4>
	  <p>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.</p>
	  <hr>
	  <p class="mb-0 ">Whenever you need to, be sure to use margin utilities to keep things nice and tidy.</p>
	</div>

						

How to use

Alert is useful to provide feedback for perticuler user actions. Here’s the example of how to use it:

• Be sure you’ve loaded the compiled Bootstrap JavaScript.
• Use the .alert class to alert message wrapper
• Use the contextual class .alert-primary, .alert-secondary, .alert-success , .alert-info , .alert-warning , .alert-danger, .alert-light, .alert-dark with the .alert class for pre-styled alert
• To add link within alert message use .alert-link

	<div class="iconic-alert">
		<div class="alert alert-warning alert-dismissible fade show" role="alert">
		  <button type="button" class="close" data-dismiss="alert" aria-label="Close">
		    <span aria-hidden="true">×</span>
		  </button>
		  <strong><i class="fa fa-warning"></i> Warning!</strong> You should check in on some of those fields below.
		</div>
	</div>

						

How to use

• For the icon in the alert box use an class .iconic-alert in the parent wrapper
• Use any icon (here FontAwesome icon used) into an <i> element