bootstrap 为珊格布局,bootstrap 关键的分界点阀值为:
1,小于768px,没有媒体查询
2,小型设备 (>768px),@media (min-width:@screen-sm-min){***}
3,中型设备(>992px),@media (min-width:@screen-md-min){***}
4, 大型设备(>1200px),@media (min-width:@screen-lg-min){***}
基本的网格结构
下面是 Bootstrap 网格的基本结构:
<div class="container"> <div class="row"> <div class="col-*-*"></div> <div class="col-*-*"></div> </div> <div class="row">...</div> </div> <div class="container">....
二。
<div class="container">
<h2>排版</h2>
<p class="text-left">左对齐文本</p>
<p class="text-right">右对齐文本</p>
<p class="text-center">居中对齐文本</p>
<p class="text-justify">对齐文本。该段落会根据屏幕的大小对超出屏幕的文字进行换行justify</p>
<p class="text-nowrap">该段落不会根据屏幕的大小对超出屏幕的文字进行换行。</p>
<p><strong>提示:</strong> 尝试重置浏览器大写查看 “text-justify” 和 “text-nowrap” 段落的效果。</p>
</div>