User:Mverma4/sandbox

Bootstrap is a free and open-source collection of tools for creating websites and web applications. It contains HTML- and CSS-based design templates for typography, forms, buttons, navigation and other interface components, as well as optional JavaScript extensions. It aims to ease the development of dynamic websites and web applications.

Bootstrap is a front end framework, that is, an interface for the user, unlike the server-side code which resides on the "back end" or server.

Originally created by a designer and a developer at Twitter, Bootstrap has become one of the most popular front-end frameworks and open source projects in the world.

Bootstrap is the most-starred project on GitHub, with over 90K stars and more than 38K forks.

Origin
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:

""A super small group of developers and I got together to design and build a new internal tool and saw an opportunity to do something more. Through that process, we saw ourselves build something much more substantial than another internal tool. Months later, we ended up with an early version of Bootstrap as a way to document and share common design patterns and assets within the company.""

After a few months of development by a small group, many developers at Twitter began to contribute to the project as a part of Hack Week, a hackathon-style week for the Twitter's development team. It was renamed from Twitter Blueprint to Bootstrap, and released as an open source project on August 19, 2011. It has continued to be maintained by Mark Otto, Jacob Thornton, and a small group of core developers, as well as a large community of contributors.

Since the initial release Bootstrap has had over twenty releases, including two major rewrites with Bootstrap 2 and Bootstrap 3.

On January 31, 2012, Bootstrap 2 was announced. This release added the twelve-column grid layout and responsive design components, as well as changes to many of the existing components. The Bootstrap 3 release was announced on 19 August, 2013, moving to a mobile first approach and using a flat design.

On October 29, 2014, Mark Otto announced Bootstrap 4 was in development. The first alpha version of Bootstrap 4 was deployed on August 19, 2015.

Getting Started with Bootstrap
Bootstrap requires a single CSS file, an optional theme file and a Javascript file to use it on a web page. Additionally, jQuery is also required for Bootstrap's JavaScript plugins. These files can be included within a Web page by linking to a local copy or to one of copy available from content delivery network (CDN) hosted by MaxCDN. It is also possible to include Bootstrap directly from CDNs:

Downloading Bootstrap
Bootstrap can be downloaded in two forms. Compiled and minified variations and source Code.

Precompiled Bootstrap
Precompiled bootstrap comes with Compiled and minified CSS, JavaScript, and fonts. No documentation or original source files are included in precompiled version. It can be downloaded from Bootstrap's Website.

Bootstrap Source Code
Bootstrap source code includes the precompiled CSS, JavaScript, and font assets, along with source Less, JavaScript, and documentation. Bootstrap source is available at Bootstrap's Website.

=== Basic Template === Below is a basic HTML template to start with bootstrap. It includes minimal CSS and Javascript resources.

Structure and Features
Bootstrap is modular and consists essentially of a series of LESS stylesheets that implement the various components of the toolkit. A stylesheet called bootstrap.less includes the components stylesheets. Developers can adapt the Bootstrap file itself, selecting the components they wish to use in their project.

Adjustments are possible to a limited extent through a central configuration stylesheet. More profound changes are possible by the LESS declarations.

The use of LESS stylesheet language allows the use of variables, functions and operators, nested selectors, as well as so-called mixins.

Since version 2.0, the configuration of Bootstrap also has a special "Customize" option in the documentation. Moreover, the developer chooses on a form the desired components and adjusts, if necessary, the values of various options to their needs. The subsequently generated package already includes the pre-built CSS style sheet.

Grid system and responsive design comes standard with a 1170 pixel wide, grid layout. Alternatively, the developer can use a variable-width layout. For both cases, the toolkit has four variations to make use of different resolutions and types of devices: mobile phones, portrait and landscape, tablets and PCs with low and high resolution. Each variation adjusts the width of the columns.

Responsive Web Design
Responsive Web Design is one of the key features of Bootstrap, since version 2.0 Bootstrap supports responsive web design. This means the layout of web pages adjusts dynamically, taking into account the characteristics of the device used (desktop, tablet, mobile phone). Starting with version 3.0, Bootstrap adopted a mobile first design philosophy, emphasizing responsive design by default.The version 4.0 alpha release added Sass and Flex box support.

Grid Layout
Grid Layout is another key feature of Bootstrap. Grid is a basic element for any layout design. The screen is split by using the   tag and CSS to place elements on the webpage. Bootstrap provides its own grid layout system.

The grid system of Bootstrap consists of 12-column grid i.e. rows are horizontal groups of columns that ensure your columns are lined up properly and the column classes indicate the number of columns you’d like to use out of the possible 12 per row.

A row is expressed by using   and a column is expressed depending on the device type/size by using . There are five grid tiers, one for each responsive breakpoint: extra small, small, medium, large, and extra large.

The  is an example of a column defined for medium sized devices with width equal to 4 columns. Grid tiers are based on minimum widths, meaning they apply to that one tier and all those above it (e.g.,  applies to medium, large, and extra large devices).

The total number of columns for one row in all devices is 12, thus for each row the   class can be expressed from   to. Column widths are set in percentages, so they’re always fluid and sized relative to their parent element.

Stylesheets/CSS
Bootstrap provides a set of stylesheets that provide basic style definitions for all key HTML components. These provide a uniform, modern appearance for formatting text, tables and form elements. Starting with Bootstrap 2, mobile friendly styles were added for key aspects of the framework. Bootstrap 3 provides Mobile First Design. Bootstrap also usages Normalize for improved cross-browser rendering.

=== Re-usable Components === In addition to the regular HTML elements, Bootstrap contains other commonly used interface elements. These include buttons with advanced features (e.g. grouping of buttons or buttons with drop-down option, make and navigation lists, horizontal and vertical tabs, navigation, breadcrumb navigation, pagination, etc.), labels, advanced typographic capabilities, thumbnails, warning messages and a progress bar. The components are implemented as CSS classes, which must be applied to certain HTML elements in a page. Styling of each component follows a basic theme and can be easily customized.

Bootstrap has following components available: Bootstrap Includes over 250 glyphs in font format from the Glyphicon Halflings set. Glyphicons Halflings are not available for free, but their creator has made them available for Bootstrap free of cost.
 * Glyphicons
 * Dropdowns
 * Button groups
 * Button dropdowns
 * Input groups
 * Navs
 * Navbar
 * Breadcrumbs
 * Pagination
 * Labels
 * Badges
 * Jumbotron
 * Page header
 * Thumbnails
 * Alerts
 * Progress bars
 * Media object
 * List group
 * Panels
 * Responsive embed
 * Wells

=== JavaScript Components === Bootstrap comes with several JavaScript components in the form of jQuery plugins. They provide additional user interface elements such as dialog boxes, tooltips, and carousels. They also extend the functionality of some existing interface elements, including for example an auto-complete function for input fields. In version 2.0, the following JavaScript plugins are supported: Modal, Dropdown, Scrollspy, Tab, Tooltip, Popover, Alert, Button, Collapse, Affix & Carousel.

Themes
Currently Bootstrap team has released three themes, one for each of the most popular types of Bootstrapped sites — dashboards, applications, and marketing sites.

Each theme includes: The themes are designed as toolkits, just like Bootstrap, to provide the user with a highly functional, visually consistent, and beautiful set of components.
 * Beautiful example pages
 * Custom documentation
 * Several brand new, custom components
 * Source Less and JavaScript files
 * Easy build tools with Gulp

While Bootstrap is free for everyone, these themes are only available for purchase

Dashboard Theme
Designed to be the perfect starting point for any dashboard or admin site. It includes charts, graphs, sortable tables, and more than a dozen other components.

A basic glimpse of the Dashboard Theme can be found here.

Marketing Theme
Designed to help build marketing sites. It includes over 15 different CSS and JS components that can adapt to any brand or style.

A basic glimpse of the Marketing Theme can be found here.

Application Theme
Designed to build robust web apps with timelines, profiles, notifications, messages, activity, and new utility classes.

A basic glimpse of the Dashboard Theme can be found here.

Browser Support
Bootstrap is compatible with the latest versions of the Google Chrome, Firefox, Internet Explorer and Safari browsers, although some of these browsers are not supported on all platforms.

Mobile Devices
Generally, Bootstrap supports the latest versions of most of the major platform’s default browsers.

Desktop Browsers
Similarly, the latest versions of most of the desktop browsers are supported.

Linux and IE7
Although Bootstrap is not officially supported for Linux and Internet Explorer 7, Bootstrap works well enough in Chromium and Chrome for Linux, Firefox for Linux, and Internet Explorer 7.

Internet Explorer 8 and 9
Bootstrap supported Internet Explorer 8 and 9, however, there are few CSS3 properties and HTML5 elements which are not fully supported by these browsers. In addition, Internet Explorer 8 requires Respond.js in order to enable media query support.

=== Bugs === Although Bootstrap works around several outstanding browser bugs in major browsers. However there are some bugs which cannot be solved by bootstrap. List of these bugs can be found here.

Release History
Since the initial release Bootstrap has had over twenty releases, including two major rewrites with Bootstrap 2 and Bootstrap 3.

The following table includes links to each release where you can find the release notes and documentation of that release.