Implementation of Grid in Bootstrap 4
Bootstrap Grid
A grid is a structure (typically two-dimensional) comprised of a progression of crossing straight (vertical, horizontal) lines used to structure the content. It is broadly used to plan format and content structure in print design. In website architecture, it is an extremely powerful strategy to make a steady format quickly and effectively utilizing HTML and CSS.
Grid Classes:
There are four classes in Bootstrap Grid System:
.col- (Extensively small device - screen width < 576px)
.col-sm- (Small device - screen width = or > 576px)
.col-md- (Medium device - screen width = or > 768px)
.col-lg- (Large device - screen width = or > 992px)
.col-xl- (Extra-large device - screen width = or > 1200px)
<div class="container">
<h1>Bootstrap Grid Example</h1>
<div class="row">
<div class="col-md-3"style="background-color:lavender;">Aditya</div>
</div>
</div>