BootStrap_1_Introduction

Contents :
 Introduction
 History
 How to work with bootstrap ?
 Basic examples
 Features
 Applications
 Conclusion
 References

Introduction
Bootstrap is the most popular HTML, CSS, and
JavaScript framework for developing responsive,
web sites.
Bootstrap is a free and open-source collection of
tools for creating websites and web applications.
Bootstrap is completely free to download and
use.

History
Bootstrap is originally created by a designer and
a developer at Twitter.
Bootstrap was created at Twitter in mid-2010 by
Mark Otto and Jocob.
Then after Bootstrap has become one of the
most popular front-end frameworks and open
source projects in the world.

Conti…
 It contains HTML- and
CSS-based design
templates for
typography, forms,
buttons, navigation and
other interface
components, as well as
optional JavaScript
extensions.

Why use Bootstrap ?
 Anybody with just basic knowledge of HTML and
CSS can start using Bootstrap. It is also compatible
with all modern browsers. Like, Chrome, Firefox,
Internet Explorer, Safari, and Opera.
 Bootstrap easily and efficiently scales your
websites and applications with a single code base,
from phones to tablets to desktops with CSS media
queries.

How to work with Bootstrap ?
First of all,
To start using Bootsrap on your own web site
there are two ways :
You can:
 Download Bootstrap from getbootstrap.com
 Include Bootstrap from a CDN

Bootstrap CDN
If you don’t want to download and host
Bootstrap yourself, you can include it from a
CDN (Content Delivery Network).
MaxCDN provide CDN support for Bootstrap’s
CSS, JavaScript and also include jQuery:

<link rel="stylesheet"
href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.6/c
ss/bootstrap.min.css">

Conti…

<link rel="stylesheet"
href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.6/c
ss/bootstrap-theme.min.css">

<script
src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/
bootstrap.min.js"></script>

What is Responsive web design ?
Responsive Web Design makes your web page
look good on all devices (desktops, tablets, and
phones).
It is an approach to web design aimed at crafting
sites to provide an optimal viewing and interaction
experience.
So its easy to reading and navigation with a
minimum of resizing, panning, and scrolling across
a wide range of devices.

Examples
Table example
Images shapes example

Features
 Speed of development
 Base styling for most HTML elements
 Bundled Javascript plugins
 Good documentation
 Responsiveness
 Consistency
 Customization
 Support

What included in latest version (3.3.6)
 Improved accessibility for panels, tooltips,
buttons, and more.
 List groups now support <button> elements.
 Applied a few tooltip and popover positioning
fixes.

Conclusion
 Now a days number of people browsing the
internet on their phone or tablet. So it’s
important to optimize websites for both desktop
and mobile browsing.
Bootstrap made for folks of all skill levels,
devices of all shapes, and projects of all sizes.
As the framework continues to develop, the
reasons to use Bootstrap keep mounting. If
you’ve overlooked this framework, it’s probably
time to give it a try.

References
http://getbootstrap.com
http://www.w3schools.com/bootstrap/
http://www.tutorialspoint.com/bootstrap/boo
tstrap_tables.htm
http://www.quara.com

BootStrap_1_Introduction

More Related Content

What's hot (20)

Similar to BootStrap_1_Introduction (20)

BootStrap_1_Introduction