Bootstrap Framework - Modern Web Development

What is Bootstrap?

Bootstrap is a free and open-source CSS framework directed at responsive, mobile-first front-end web development. It contains CSS- and JavaScript-based design templates for typography, forms, buttons, navigation, and other interface components.

Originally created by Twitter developers Mark Otto and Jacob Thornton, Bootstrap was released as an open source product in August 2011 on GitHub. As of 2025, Bootstrap is the world's most popular CSS framework, used by millions of websites.

Key Features of Bootstrap

Responsive Grid

Powerful mobile-first flexbox grid system for building layouts of all shapes and sizes

Components

Pre-styled components like buttons, navigation, cards, and modals for rapid UI development

Customization

Easily customize Bootstrap with Sass variables and modular architecture

Rapid Development

Speed up development with pre-built components and utility classes

Quick Bootstrap Example

Here's a simple example of Bootstrap's grid system:

<div class="container">
  <div class="row">
    <div class="col-sm">
      One of three columns
    </div>
    <div class="col-sm">
      One of three columns
    </div>
    <div class="col-sm">
      One of three columns
    </div>
  </div>
</div>

This code automatically creates three equal-width columns on small, medium, large, and extra large devices.

Popular Bootstrap Components

Navigation Bar

Bootstrap's responsive navbar automatically collapses on smaller devices into a hamburger menu.

Cards

Bootstrap's card component provides a flexible and extensible content container with multiple variants.

Card Title

Some quick example text to build on the card title and make up the bulk of the card's content.

Go somewhere

Bootstrap Version History

Bootstrap 1.0 (2011)

Originally named Twitter Blueprint, was developed at Twitter as a framework to encourage consistency across internal tools.

Bootstrap 2.0 (2012)

Added responsive design and twelve-column grid system. Officially renamed from Twitter Bootstrap to just Bootstrap.

Bootstrap 3.0 (2013)

Mobile-first approach, flat design style, and redesigned components. Dropped IE7 support.

Bootstrap 4.0 (2018)

Major rewrite, switched to Sass, added flexbox grid system, and dropped IE9 support.

Bootstrap 5.0 (2021)

Dropped jQuery dependency, added custom CSS properties, improved customizing docs, and dropped IE10/11 support.

Getting Started with Bootstrap

To start using Bootstrap in your project, you can include it via CDN:

<!-- CSS -->
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">

<!-- JavaScript -->
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script>

Alternatively, you can install Bootstrap via npm:

npm install bootstrap

View Official Documentation