查看“Bootstrap Columns”的源代码

__NOTOC__
<div class="col-md-12"> 
<div class="panel panel-primary-light-border"> 
<div class="panel-heading"><h3 class="panel-title">col-md-12</h3> </div> 
<div class="panel-body">
<pre>
<div class="col-md-12"> is equal to 100% width
</pre>
</div> 
</div> 
</div>
<div class="column clearfix"> 
<div class="col-md-11"> 
<div class="panel panel-primary-light-border"> 
<div class="panel-heading"> <h3 class="panel-title">col-md-11</h3> </div> 
<div class="panel-body">
<pre>
<div class="col-md-11"> is equal to 91.66666666666666% width
</pre>
</div> 
</div>
</div>
<div class="col-md-1"> 
<div class="panel panel-primary-light-border"> 
<div class="panel-heading"> <h3 class="panel-title">1</h3> </div> 
<div class="panel-body">
<pre>8.33%</pre>
</div> 
</div>
</div>
</div>
<div class="column clearfix"> 
<div class="col-md-10"> 
<div class="panel panel-primary-light-border"> 
<div class="panel-heading"> <h3 class="panel-title">col-md-10</h3> </div> 
<div class="panel-body">
<pre>
<div class="col-md-10"> is equal to 83.33333333333334% width
</pre>
</div> 
</div>
</div>
<div class="col-md-2"> 
<div class="panel panel-primary-light-border"> 
<div class="panel-heading"> <h3 class="panel-title">col-md-2</h3> </div> 
<div class="panel-body">
<pre>
16.66%
</pre>
</div> 
</div>
</div>
</div>
<div class="column clearfix"> 
<div class="col-md-9"> 
<div class="panel panel-primary-light-border"> 
<div class="panel-heading"> <h3 class="panel-title">col-md-9</h3> </div> 
<div class="panel-body">
<pre>
<div class="col-md-9"> is equal to 75% width
</pre>
</div> 
</div>
</div>
<div class="col-md-3"> 
<div class="panel panel-primary-light-border"> 
<div class="panel-heading"> <h3 class="panel-title">col-md-3</h3> </div> 
<div class="panel-body">
<pre>
<div class="col-md-3"> 25%
</pre>
</div> 
</div>
</div>
</div>
<div class="column clearfix"> 
<div class="col-md-8"> 
<div class="panel panel-primary-light-border"> 
<div class="panel-heading"> <h3 class="panel-title">col-md-8</h3> </div> 
<div class="panel-body">
<pre>
<div class="col-md-8"> is equal to 66.66666666666666% width
</pre>
</div> 
</div>
</div>
<div class="col-md-4"> 
<div class="panel panel-primary-light-border"> 
<div class="panel-heading"> <h3 class="panel-title">col-md-4</h3> </div> 
<div class="panel-body">
<pre>
<div class="col-md-4"> 33.33% width
</pre>
</div> 
</div>
</div>
</div>
<div class="column clearfix"> 
<div class="col-md-7"> 
<div class="panel panel-primary-light-border"> 
<div class="panel-heading"> <h3 class="panel-title">col-md-7</h3> </div> 
<div class="panel-body">
<pre>
<div class="col-md-7"> is equal to 58.333333333333336% width
</pre>
</div> 
</div>
</div>
<div class="col-md-5"> 
<div class="panel panel-primary-light-border"> 
<div class="panel-heading"> <h3 class="panel-title">col-md-5</h3> </div> 
<div class="panel-body">
<pre>
<div class="col-md-5"> is equal to 41.667%
</pre>
</div> 
</div>
</div>
</div>
<div class="column clearfix"> 
<div class="col-md-6"> 
<div class="panel panel-primary-light-border"> 
<div class="panel-heading"> <h3 class="panel-title">col-md-6</h3> </div> 
<div class="panel-body">
<pre>
<div class="col-md-6"> is equal to 50% width
</pre>
</div> 
</div>
</div>
<div class="col-md-6"> 
<div class="panel panel-primary-light-border"> 
<div class="panel-heading"> <h3 class="panel-title">col-md-6</h3> </div> 
<div class="panel-body">
<pre>
<div class="col-md-6"> is equal to  50% width
</pre>
</div> 
</div>
</div>
</div>