Bootstrap Components Reusable components built to provide iconography, dropdowns, input groups, navigation, alerts, and much more. http://getbootstrap.com

Why? They look good Themeable Replacement for HTML server controls Great for Ajax / SPA AJAX stands for Asynchronous JavaScript And XML. In a nutshell, it is the use of the XMLHttpRequest object to communicate with servers. It can send and receive information in various formats, including JSON, XML, HTML, and text files. Single-Page Applications (SPAs) are Web apps that load a single HTML page and dynamically update that page as the user interacts with the app.

Components The slide shows a grab bag of components from the http://getbootstrap.com website.

Grouping Containers Jumbotron Badge Card Containers Containers are the most basic layout element in Bootstrap and are required when using our default grid system. Choose from a responsive, fixed-width container (meaning its max-width changes at each breakpoint) or fluid-width (meaning it’s 100% wide all the time). While containers can be nested, most layouts do not require a nested container. Jumbotron is a large components that is typically the top section of your site. Badge used to be called label, but changed to badge with bootstrap version 4, can be used for identifying labels or links or to draw your attention to something. A card is a flexible and extensible content container. It includes options for headers and footers, a wide variety of content, contextual background colors, and powerful display options. Card used to be called panel.

Objects Glyphicons Dropdowns Buttons Glyphicons are scalable icons. Find them at glyphicons.com Dropdowns are toggleable, contextual overlays for displaying lists of links and more. They’re made interactive with the included Bootstrap dropdown JavaScript plugin. They’re toggled by clicking, not by hovering. Buttons are typically used to trigger in-page functionality. Typically cause an event to be called that is handled through code.

Glyphicons Glyphicons are scalable icons. Find them at glyphicons.com

Who’s got the button? Use btn to make something look like a button Use btn-modifier to change the look Default Primary Success Info Warning Danger Buttons are typically used to trigger in-page functionality. Typically cause an event to be called that is handled through code.

Enhanced Buttons Group a series of buttons together with btn-group Toggle Buttons Radio button Checkbox Wrap a series of buttons with .btn in .btn-group

Navigation Navs Navbar Breadcrumbs Pagination Navs – Bootstraps included navigation components. Navbar- Bootstrap's powerful, responsive navigation header. Includes support for branding, navigation, and more, Breadcrumbs - Indicate the current page's location within a navigational hierarchy. Pagination – used to indicate a series of related content exists across multiple pages.