Steps to override SASS of Bootstrap
Step 1: Install Bootstrap using the following command
npm i bootstrap sass
Step 2: Create your custom SCSS file and write the variable you want to override. Then include the bootstrap SCSS file using import.
$variable_to_override: value
@import "../node_modules/bootstrap/scss/bootstrap.scss";
Step 3: Convert the SCSS file to CSS using a live server extension or using this command in terminal
sass styles.scss styles.css
Step 4: Include the CSS file in your HTML file.
<link rel="stylesheet" href="styles.css">
Bootstrap 5 Customizing the Grid
Bootstrap Grid system is one of the most versatile layouts which we can use and it has different responsive variants which can be used to add custom responsiveness. Bootstrap Grid system provides a responsive layout with columns and gutters. Customizing the grid is essentially changing the number of columns or gutters’ width or changing the breakpoints at which the grids will attain the specific width given to them.
Contact Us