What is twitter bootstrap
Twitter Bootstrap is a toolkit to develop web apps and sites fast. It includes basic CSS and HTML for creating Grids, Layouts, Typography, Tables, Forms, Navigation, Alerts, Popovers etc.
In this and consequent pages, w3resource covers Twitter Bootstrap tool in detail, which will equip you to build web apps and sites using the tool.
Browser Support
Twitter Bootstrap is created with modern browsers in mind. So, you will find it working perfectly with all the modern versions of Chrome, Firefox, Safari, Opera and Internet Explorer.
Obtain Twitter Bootstrap
Download Twitter Bootstrap from https://github.com/twitter/bootstrap.
Unzip the downloaded file and you will get all the necessary files for working with the toolkit.
Getting started with Twitter Bootstrap
You can include twitter Bootstrap in your HTML page in two ways.
You can simply include
<link rel="stylesheet" href="http://twitter.github.com/bootstrap/assets/css/bootstrap-1.0.0.min.css">
in the head section of your HTML file.
Since Twitter Bootstrap supports LESS (CSS preprocessor for faster and easier web development), you can include the less css file and less JS file in your HTML page as
<link rel="stylesheet/less" href="/path/to/bootstrap.less">
<script src="/path/to/less.js"></script>
<script src="/path/to/less.js"></script>
What you will learn
In w3resource "Twitter Bootstrap Tutorial" you will learn the following.
Grid system
You will see how to create Grid System using Twitter Bootstrap. It supports 940px wide 16 column Grid as default and many variations of it.
Layouts
You will see how to create 940px wide fixed Layout and how to create Fluid layouts. This will help you to build HTML templates easily.
Typography
You will see how to build Headings, paragraphs, lists, and other inline type elements.
Tables
You will see how to build tables for containing tabular data.
Forms
You will see how to build stylish forms, including textbox, radio button, textarea, various kind of buttons in your HTML page.
Navigation
You will see how to build stylish modern navigation. And also Pagination.
Alerts & Error
As a web designer / developer you often need to create alerts for errors, warnings etc. In this tutorial you will learn how to build those using Twitter Bootstrap.
Popovers
You will learn to use the toolkit to build modal windows, tooltips and popovers.
Read more: http://www.w3resource.com
Just view more video tutorial: http://webdesign.tutsplus.com/tutorials/complete-websites/twitter-bootstrap-101-introduction/
For Further Reading,
