<link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css">
<script src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/js/bootstrap.min.js"></script>
<script src="//code.jquery.com/jquery-1.11.1.min.js"></script>
<!------ Include the above in your HEAD tag ---------->
<div class="container">
<div class="row">
<div class="col-sm-12 a">1</div>
</div>
<div class="row">
<div class="col-sm-12 aa">2</div>
</div>
<div class="row">
<div class="col-sm-12 aaa">3</div>
</div>
<div class="row">
<div class="col-sm-12 aaaa">4</div>
</div>
<div class="row">
<div class="col-sm-12 aaaaa">5</div>
</div>
<div class="row">
<div class="col-sm-12 aaaaaa">6</div>
</div>
<div class="row">
<div class="col-sm-12 aaaaaaa">7</div>
</div>
<div class="row">
<div class="col-sm-12 aaaaaaaa">8</div>
</div>
<div class="row">
<div class="col-sm-12 aaaaaaaaa">9</div>
</div>
</div>
.col-sm-12 {
height: 50px;
}
.a {
background: linear-gradient(to left, rgb(142, 158, 171), rgb(238, 242, 243));
}
.aa {
background: linear-gradient(to left, rgb(171, 186, 171), rgb(255, 255, 255));
}
.aaa {
background: linear-gradient(to left, rgb(96, 108, 136), rgb(63, 76, 107));
}
.aaaa {
background: linear-gradient(to left, rgb(185, 147, 214), rgb(140, 166, 219));
}
.aaaaa {
background: linear-gradient(to left, rgb(236, 233, 230), rgb(255, 255, 255));
}
.aaaaaa {
background: linear-gradient(to left, rgb(35, 37, 38), rgb(65, 67, 69));
}
.aaaaaaa {
background: linear-gradient(to left, rgb(117, 127, 154), rgb(215, 221, 232));
}
.aaaaaaaa {
background: linear-gradient(to left, rgb(0, 0, 0), rgb(67, 67, 67));
}
.aaaaaaaaa {
background: linear-gradient(to left, rgb(69, 127, 202), rgb(86, 145, 200));
}