MENU

Custom Build

So far we have been using the standard pre-compiled Bootstrap CSS and JS libraries in our codes. You can customize the themes and rebuild Bootstrap yourself.

To do this, first, download the complete set of the Bootstrap source files from the official website. They have been zipped into a single file. After you have extracted the contents into a directory of your choice, you can modify the source files, particularly [bootstrap]/scss/_variables.scss, which contains a list of about 1000 easily adjustable parameters such as:

• The z-index of various components.
• The breakpoints of the responsive grid container.
• The responsive font sizes.
• The breadcrumb separator.
• The carousel transition duration.
• The exact values of various utilities.

Notice Bootstrap uses SCSS, which is an extension to CSS. An introduction to SCSS can be found here.

You need Node.js to install the dependencies on your first run so that you can subsequently compile the source codes right away:

This produces in the [bootstrap]/dist/ directory the library files which you can include in your web pages.

For improved cross-browser rendering, Bootstrap uses Reboot to correct inconsistencies across browsers and devices while providing slightly more opinionated resets to common HTML elements.