Skip to content

Instantly share code, notes, and snippets.

@lawnzapper
Created May 22, 2014 12:18
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save lawnzapper/d82f338906f28e8dee2d to your computer and use it in GitHub Desktop.
Save lawnzapper/d82f338906f28e8dee2d to your computer and use it in GitHub Desktop.
HTML: Bootstrap 3.1.1
<!DOCTYPE html>
<html>
<head>
<title>Bootstrap 101 Template</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<!-- Bootstrap -->
<!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="http://netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css">
<!-- Optional theme -->
<link rel="stylesheet" href="http://netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap-theme.min.css">
<style type="text/css">
.example-block {
height: 75px;
background-color: #b3b3b3;
margin-top: 5px;
}
.example-block.alt {
background-color: #ff8000;
margin-top: 5px;
}
.example-block.second-row {
height: 75px;
background-color: #00ff00;
margin-top: 5px;
}
.example-block.alt.second-row {
background-color: #ff00ff;
margin-top: 5px;
}
</style>
<!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries -->
<!--[if lt IE 9]>
<script src="../../assets/js/html5shiv.js"></script>
<script src="../../assets/js/respond.min.js"></script>
<![endif]-->
</head>
<body>
<div class="container">
<div class="row">
<div class="col-lg-3 example-block alt second-row">.col-lg-3</div>
<div class="col-md-3 example-block second-row">.col-md-3</div>
<div class="col-sm-3 example-block alt">.col-sm-3</div>
<div class="col-xs-3 example-block ">.col-xs-3</div>
</div>
<div class="row">
<div class="col-lg-3 col-md col-sm col-xs example-block alt">
<p>ciao</p>
</div>
<div class="col-lg-3 col-md col-sm col-xs example-block">
<p>ciao</p>
</div>
</div>
<div class="row">
<div class="col-lg-3 col-md col-sm col-xs example-block">
<p>ciao</p>
</div>
<div class="col-lg-3 col-md col-sm col-xs example-block">
<p>ciao</p>
</div>
</div>
</div>
<!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
<script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script>
<!-- Latest compiled and minified JavaScript -->
<script src="http://netdna.bootstrapcdn.com/bootstrap/3.0.0/js/bootstrap.min.js"></script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment