Bootstrap Introduction

Bootstrap 3 Introduction

• Bootstrap has turned into the most popular front-end framework for building responsive sites.
• Fortunately, it already includes a wide range of jQuery and CSS effects that will polish every website within no time.
• It is a very powerful front-end framework for faster and easier mobile first web development.
• It is free and you can use it in any kind of projects.
• It have many predefined CSS classes to use directly in your HTML page, like text-center, mark and small etc.
• You can divide complete width of web page up-to 12 responsive columns, means you can define width of an element as per device width.

What is Responsive Web Page Design

The web pages designed for desktops, may not look good on mobile ( small screen ) devices, because horizontal scrolling required to view all the content.

And If the web page content rearrange ( wrap below other ), in the mobile devices according to the pixel width of the screen, then the user only need to scroll vertically.

The web pages such that when device screen width decrease some horizontal content goes down, or design specification changes based on the device width is known as responsive design.

Mostly in the desktop design the content is divided in multiple columns, and each column arrange side by side. And for small width devices the columns are arranged one below other.

Bootstrap Versions

Bootstrap have two primary version in current use, version 3 and version 4. The version 3 is old one, but many sites still using version 3.

Bootstrap 4 is new, fast and having more responsive features.

Bootstrap CSS and jQuery Component Library

Bootstrap have both CSS and jQuery library components. You have to include both in your HTML pages to use it just like any other CSS stylesheets or jQuery script file.

How to use Bootstrap in HTML Files

In the HTML file you have to add both bootstrap CSS and jQuery files with the link and script tag respectively.

<link rel="stylesheet" href="css/bootstrap.css">
<script src="js/jquery-3.1.1.js"></script>
<script src="js/bootstrap.js"></script>

Features of Bootstrap 3

Bootstrap is compatible with all major browsers like Chrome, Firefox, Internet Explorer, Edge, Safari, and Opera etc.

Bootstrap includes both CSS and jQuery components for text, forms, buttons, tables, navigation, image, carousels and many more.

Bootstrap have responsive classed like row and column. You can divide each row up-to 12 columns.