Embed Size (px)
DESCRIPTION
Just as jQuery transformed JavaScript development, Bootstrap is enhancing the front end development. Released less than two years ago, it has become very popular and is used by NASA, NBC, Discovery Channel and White House websites. Bootstrap includes a responsive grid system, typography, pre-styled elements and JavaScript plugins for commonly used functions. It saves a significant amount of time you would normally waste writing the same code for each new project. Learn how get started with Bootstrap, see useful examples and build a responsive single page website from start to finish.
Citation preview
credit: http://www.aic.cuhk.edu.hk/web8/Reinventing%20the%20wheel.htm
Repeal
Bootstrap
<head>
<title>Gaurav Gupta</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="css/bootstrap.css">
<link rel="stylesheet" href="css/myCustomStylesheet.css">
<!--[if lt IE 9]>
<script src="js/html5shiv.js"></script>
<script src="js/respond.min.js"></script>
<![endif]-->
</head>
<body>
<header></header>
<nav></nav>
<section></section>
<section></section>
<section></section>
<section></section>
<footer></footer>
<script src="js/jquery.js"></script>
<script src="js/bootstrap.min.js"></script>
</body>
<div class="row">
<div class="col-md-4">col-md-4</div>
<div class="col-md-8">col-md-8</div>
</div>
col-md-8col-md-4
screen size prefixes
relative width of columns
numbers must add up to 12
/* myCustomStylesheet.css */
.navbar-default {
background-color: #74716a;
border-color: #FFF;
}
/* bootstrap.css */
.navbar-default {
background-color: #f8f8f8;
border-color: #e7e7e7;
}
