Bootstrap Tutorial

Table of contents

No heading

No headings in the article.

                BOOTSTRAP BASICS

Bootstrap is a powerful toolkit, a collection of HTML, CSS, and Javascript tools for creating and building web pages and web applications. It is free and open source project, hosted on GitHub, and originally created by (and for) twitter. Bootstrap is available in two forms; as a precompiled version, and as a source code version. The source code version uses the less CSS preprocessor, but if you are more into Sass, there is an official Sass port of bootstrap also available. To make it easier to make use of CSS vendor prefixes, Bootstrap uses Autoprefixer. FILE STRUCTURE The bootstrap structure is pretty simple and self explanatory. It includes precompiled files that enable quick usage in any web project. Besides compiled and minified CSS and JS files, it also includes fonts from Glyphicons, and the optional starting bootstrap theme. This structure can easily be incorporated in your own projects file structure by just including the bootstrap files exactly as they come out of the zip archive, or if it suits your project better you can rearrange these files and place them anywhere you like. BOOTSTRAP TEMPLATES AND UI COMPONENTS Bootstrap comes bundled with basic HTML and CSS design templates that include many common UI components, these include Typography, Tablets, Forms, Buttons and input groups, Navigation, pagintion, labels and badges, alerts progress bars modals Tabs, Accordions, Carousels, and many others.

BOOTSTRAP GRID SYSTEM The bootstrap 4 grid system is used to create a responsive website layout. The bootstrap 4 offers a mobile-first flexbox grid system that allows you to divide the viewport or screen into 12 columns. It also provides predefined Bootstrap grid classes that help to make a grid very quickly for devices such as cell phones, tablets, laptops, etc.