Bootstrap Grid System

Bootstrap Grid System

What is Grid 

In graphic design, a grid is a structure (usually two-dimensional) made up of a series of intersecting straight (vertical, horizontal) lines used to structure the content. It is widely used to design layout and content structure in print design. In web design, it is a very effective method to create a consistent layout rapidly and effectively using HTML and CSS. To put in simple words, grids in web design organise and structure content, makes the websites easy to scan and reduces the cognitive load on users. 
 

What is Bootstrap Grid System ?

 

Bootstrap includes a responsive, mobile first fluid grid system that appropriately scales up to 12 columns as the device or viewport size increases. It includes
predefined classes for easy layout options, as well as powerful mixins for generating more semantic layouts. Let us understand the above statement. Bootstrap 3 is mobile first in the sense that the code for Bootstrap now starts by targeting smaller screens like mobile devices, tablets, and then “expands” components and grids for larger screens such as laptops, desktops.
 

Bootstrap Grid System

Basic Grid Structure

 

<div class="container">
   <div class="row">
     <div class="col-*-*"></div>
     <div class="col-*-*"></div>
   </div>
</div>

 

Bootstrap Column system
 


 

Thank You for visit Webriceter.com Design & Develop by Abdur Rahaman