twitter bootstrap tutorial
DESCRIPTION
twitter bootstrap tutorial, twitter bootstrap tutorial for starter, twitter bootstrap tutorial for beginners, twitter bootstrap download, twitter bootstrap grid system, twitter bootstrap versions, twitter bootstrap helps in web development and designing, twitter bootstrap definition, twitter bootstrap latest version, twitter bootstrap , why we use twitter bootstrap, twitter bootstrap history, twitter bootstrap features, twitter bootstrap tutorial audience, twitter bootstrap essential things, twitter bootstrap grid systemTRANSCRIPT
TWITTER BOOTSTRAP TUTORIAL
Twitter Bootstrap Tutorial
www.webtechschools.com
TWITTER BOOTSTRAP
Twitter bootstrap framework which makes web designing and
development quick and easy.
It composes of Html, CSS and JavaScript.
It makes project interactive and responsive.
With this we can form layouts which are responsive and easily
maintained.
Twitter Bootstrap Tutorial
www.webtechschools.com
THIS TUTORIAL CONTAINS
Definition
Advantages
Disadvantages
Futures
Versions
And Many more
Twitter Bootstrap Tutorial
www.webtechschools.com
DEFINITION OF TWIT TER B OOTSTRAP
Bootstrap is a front- end framework which makes web development
rapid and simple and contains CSS and Html based template for user
interface components. With this anyone can create responsive layouts
easily.
Twitter Bootstrap Tutorial
www.webtechschools.com
A D VA N TA G E S O F T W I T T E R B O O T S T R A P
Contains free set of tools.
Anyone can create responsive and stretchable web layouts.
You can create scroll spy and type heads without the help of
JavaScript function.
Free to download.
It saves a lot of time and efforts
Twitter Bootstrap Tutorial
www.webtechschools.com
DISADVANTAGES OF TWIT TER B OOTSTRAP
Properties for rounded corners, gradients and shadows which are of
css3 are used by twitter bootstrap but they are not supported in web
browser’s older versions specifically Internet Explorer.
Twitter Bootstrap Tutorial
www.webtechschools.com
FEATURES OF TWIT TER B OOTSTRAP
Developed, maintained and hosted by GitHub.
Mobile first design
Developers can give contribution to the platform.
Languages like Chinese, Spanish, and Russian etc. are present.
Twitter Bootstrap Tutorial
www.webtechschools.com
VERSIONS OF TWIT TER B OOTSTRAP
Version 1
V1.0.0, V1.1.0, V1.1.1, V1.2.0, V1.3.0, V1.4.0
Version 2
v2.3.2, v2.3.1, v2.3.0, v2.2.2, v2.2.1, v2.2.0, v2.1.1, v2.1.0, v2.0.4,
v2.0.3, v2.0.2, v2.0.1, v2.0.0
Version 3
V3.2.0, v3.1.1, v3.1.0, v3.0.3, v3.0.2, v3.0.1, V3.0.0
Twitter Bootstrap Tutorial
www.webtechschools.com
DOWNLOAD TWITTER B OOTSTRAP
Downloading of bootstrap is very effortless.
http://getbootstrap.com/
Two modes of download - download bootstrap and download source.
Twitter Bootstrap Tutorial
www.webtechschools.com
CREATE WEBPAGES WITH TWIT TER B OOTSTRAP
1st step – Create html file
2nd step – Make this file a twitter bootstrap template
3rd step – Save file
Twitter Bootstrap Tutorial
www.webtechschools.com
GRID SYSTEM – TWIT TER B OOTSTRAP
Bootstrap grid system generates layouts by a series of
rows columns.
The default Bootstrap grid system is made of 12 columns
grid that creates 940px wide container without responsive
features enabled but you can enable them by adding
bootstrap-responsive.css file.
Twitter Bootstrap Tutorial
www.webtechschools.com
MOBILE FIRST STRATEGY IN TWITTER BOOTSTRAP
It contains 3 main components
Content
Layout
Progressive enhancement
Twitter Bootstrap Tutorial
www.webtechschools.com
CREATE FIXED AND FLUID LAYOUTS
For fixed –
.container class can be used to create fixed length layout
of web page.
For fluid –
To make the layout fluid you change the class .container
to .container-fluid and row by .row to .row-fluid.
Twitter Bootstrap Tutorial
www.webtechschools.com
Thank you
Twitter Bootstrap Tutorial
www.webtechschools.com