Bootstrap, originally named Twitter Blueprint, was developed by Mark Otto and Jacob Thornton at Twitter as a framework to encourage consistency across internal tools. Before Bootstrap, various libraries were used for interface development, which led to inconsistencies and a high maintenance burden. According to Twitter developer Mark Otto.
Bootstrap has clearly defined breakpoints for different kinds of devices, specified by using CSS media queries. Bootstrap's responsive CSS adjusts to phones, tablets, and desktops The following are the breakpoint categories used for the different types of devices...
Bootstrap's grid system allows up to 12 columns across the page. Bootstrap's grid system is responsive, and the columns will re-arrange automatically depending on the screen size.
If you do not want to use all 12 column individually, you can group the columns together to create wider columns:
span 1 span 1 span 1 span 1 span 1 span 1 span 1 span 1 span 1 span 1 span 1 span 1
Bootstrap's global default font-size is 14px, with a line-height of 1.428. This is applied to the body and all paragraphs. In addition, all elements have a bottom margin that equals half their computed line-height (10px by default).
1. Add the HTML5 doctype Bootstrap uses HTML elements and CSS properties that require the HTML5 doctype. Always include the HTML5 doctype at the beginning of the page, along with the lang attribute and the correct character set: 2. Bootstrap 3 is mobile-first Bootstrap 3 is designed to be responsive to mobile devices. Mobile-first styles are part of the core framework. 3. Containers Bootstrap also requires a containing element to wrap site contents.
Media queries allow for custom CSS based on a number of conditions—ratios, widths, display type, etc—but usually focuses around min-width and max-width.