Learning Bootstrap

Using the Bootstrap variables and mixins

You can use variables and mixins in Bootstrap to build semantic layouts. We will now look at variables used in Bootstrap for the grid layout.

Bootstrap comes with built-in variables and mixins for building semantic grid layouts.

Bootstrap Grid variables

The LESS code for the Bootstrap Grid contains three variables:

• @grid-columns: This variable is used to define the maximum number of columns displayed on desktops and large screens. The default value is 12. However, by assigning a specific value, we can change the default value to less or more than 12, as per the requirement.
• @grid-gutter-width: This variable is the width of the gutter. The gutter is the vertical space between the grid columns, and the default ...