Bootstrap is a framework with the mobile-first design approach for building responsive web sites. It provides pre-made styles, layout tools and interactive components. To use this framework you also need jQuery and Popper.js and Bootstrap's JavaScript plugins and Bootstrap's stylesheet.

Bootstrap was originally created at Twitter called Twitter Blueprint. The project evolved at Twitter's Hack Week. Bootstrap has now became a popular open source project.

The layout uses a container and a series of rows and columns. It starts with a <div> tag with the class 'container'. In that container class for the <div> tag, you have atleast one <div> tag with class of 'row'. In that row class for the <div> tag, you have atleast one <div> tag with class of 'col'.

Here is an example of a container with a row and 2 columns.

                    <div class='container'>
                        <div class='row'>
                            <div class='col'>
                                This is the first column.
                            </div>
                            <div class='col'>
                                This is the second column.
                            </div>
                        </div>
                    </div>   
                

This looks like this on the website:

Here lies caveats that are important to know when working with Bootstrap:

• Bootstrap 4 uses flexbox as in most of the components have flexbox enabled.

• To toggle visability you can use the class of 'visibility' or 'invisibility' instead of toggling display.

• Use margin and padding properties to control spacing and size of the components.

• Bootstrap has a default z-index scale for its elements.

• Bootstrap ha native font stack which depends on the OS of the device.

For more information you can see the official documentation here: https://getbootstrap.com/