Bootstrap

From David's Wiki
The printable version is no longer supported and may have rendering errors. Please update your browser bookmarks and please use the default browser print function instead.
\( \newcommand{\P}[]{\unicode{xB6}} \newcommand{\AA}[]{\unicode{x212B}} \newcommand{\empty}[]{\emptyset} \newcommand{\O}[]{\emptyset} \newcommand{\Alpha}[]{Α} \newcommand{\Beta}[]{Β} \newcommand{\Epsilon}[]{Ε} \newcommand{\Iota}[]{Ι} \newcommand{\Kappa}[]{Κ} \newcommand{\Rho}[]{Ρ} \newcommand{\Tau}[]{Τ} \newcommand{\Zeta}[]{Ζ} \newcommand{\Mu}[]{\unicode{x039C}} \newcommand{\Chi}[]{Χ} \newcommand{\Eta}[]{\unicode{x0397}} \newcommand{\Nu}[]{\unicode{x039D}} \newcommand{\Omicron}[]{\unicode{x039F}} \DeclareMathOperator{\sgn}{sgn} \def\oiint{\mathop{\vcenter{\mathchoice{\huge\unicode{x222F}\,}{\unicode{x222F}}{\unicode{x222F}}{\unicode{x222F}}}\,}\nolimits} \def\oiiint{\mathop{\vcenter{\mathchoice{\huge\unicode{x2230}\,}{\unicode{x2230}}{\unicode{x2230}}{\unicode{x2230}}}\,}\nolimits} \)

Bootstrap is the most popular CSS framework.
It has an excellent set of examples on it's website for all of its functionality.

Getting Started

Add bootstrap using npm

npm i bootstrap

Import bootstrap into your main scss file or include it as a css stylesheet.

@import '~bootstrap/scss/bootstrap';

Additions and Alternatives

Bootstrap Native

Bootstrap Native replaces the JS portion of Bootstrap 4/5 with a vanilla JS implementation.
It allows you to use Bootstrap's interactive portions without requiring JQuery or popper.js.
Since most existing Bootstrap's JS api uses JQuery commands, this is not a drop-in replacement for Bootstrap.
Note that bootstrap 5 no longer uses jquery.