BOOSTRAP GRID系统应用DEMO
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Bootstrap Grid网格布局</title>
<link rel="stylesheet" type="text/css" href="css/bootstrap.css">
<style>
.wrap{
background-color: #eee;
}
.col{
font-size: 50px;
width: 70px;text-align: center;
background-color: lightblue;
}
</style>
</head>
<body>
<div class="wrap">
<div class="row">
<div class="col col-md-1">1</div>
<div class="col col-md-1">2</div>
<div class="col col-md-1">3</div>
<div class="col col-md-1">4</div>
<div class="col col-md-1">5</div>
<div class="col col-md-1">6</div>
<div class="col col-md-1">7</div>
<div class="col col-md-1">8</div>
<div class="col col-md-1">9</div>
<div class="col col-md-1" >10</div>
<div class="col col-md-1">11</div>
<div class="col col-md-1">12</div>
</div>
<div class="row">
<div class="col col-md-1" >A</div>
<div class="col col-md-2" >B</div>
<div class="col col-md-3" >C</div>
<div class="col col-md-6" >D</div>
</div>
</div>
</body>
</html>
getbootstrap.com
继续学习此内容