Bootstrap 3 Template
This is a simple Twitter Bootstrap 3 template. You can fork it to get a ready to use Bootstrap 3 fiddle.
HTML
<script src="//netdna.bootstrapcdn.com/bootstrap/3.0.0/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css">
<div class="container">
<div class="row">
<div class="col-xs-12 col-sm-6 col-md-3">
<article class="post-wrapper">
<h1>Post Regular Theme</h1>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas nec metus ante. Aenean sed erat imperdiet ante convallis sagittis nec in augue.</p>
</article>
</div>
<div class="col-xs-12 col-sm-6 col-md-3">
<article class="post-wrapper info">
<h1>Post Info Theme</h1>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas nec metus ante. Aenean sed erat imperdiet ante convallis sagittis nec in augue.</p>
</article>
</div>
<div class="clearfix visible-sm-block"></div>
<div class="col-xs-12 col-sm-6 col-md-3">
<article class="post-wrapper success">
<h1>Post Success Theme</h1>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas nec metus ante. Aenean sed erat imperdiet ante convallis sagittis nec in augue.</p>
</article>
</div>
<div class="col-xs-12 col-sm-6 col-md-3">
<article class="post-wrapper warning">
<h1>Post Warning Theme</h1>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas nec metus ante. Aenean sed erat imperdiet ante convallis sagittis nec in augue.</p>
</article>
</div>
</div>
</div>
CSS
/* CSS THEMES */
.warning{
color: #9A2C2C;
background-color: #FFE2E2;
border-color: #9A2C2C;
}
.info{
color: #fD5E7D;
background-color: #CEEAF1;
border-color: #2D5E7D;
}
.success{
color: #fD7D36;
background-color: #1EF1D2;
border-color: #2D7D36;
}
/* General Classes */
.post-wrapper{
padding: 15px;
margin-bottom: 30px;
border: 1px solid #ccc;
box-shadow: 2px 2px 2px rgba(0,0,0, 0.2);
border-radius: 5px;
}
JavaScript
/* Latest compiled and minified JavaScript included as External Resource */