Create Bootstrap Responsive Wells Example Tutorial

How to use bootstrap well classes to make rounded border with background color around the inside page content.

Bootstrap well class is used to arrange the element inside web page with  and help us to show some text with highlight feature. So here is the complete step by step tutorial for Create Bootstrap Responsive Wells Example Tutorial.

Types of Wells according to DIV classes :

  1. Normal well : .well class.
  2. Large well : .well well-lg class.
  3. Small well : .well well-sm class.

https://www.android-examples.com/demo/heading-tag.html

How to Create Bootstrap Responsive Wells Example Tutorial.

Code for well.html file.

 <!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Well</title>
<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>

<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>

</head>

<body>

<div class="container">

 <h2>Normal Well</h2>
 
 <div class="well">This the normal well example</div>
 
 <h2>Large Well</h2>
 
 <div class="well well-lg">This the large well example</div>
 
 <h2>Small Well</h2>
 
 <div class="well well-sm">This the small well example</div>
 
</div>

</body>
</html>

Screenshot:

Create Bootstrap Responsive Wells Example Tutorial

Leave a Reply

Your email address will not be published. Required fields are marked *