首页 > 其他 > 详细

Bootstrap-1

时间:2015-03-16 22:55:57      阅读:379      评论:0      收藏:0      [点我收藏+]

1.

header 里面的 meta标签

<meta name="viewport" content="width=device-width,initial-scale=1.0,user-scalable=no,maximum-scale=1.0"/>

name="viewport"  定义布局

width=device-wdith  设置的宽度

initial-scale=1.0 确保加载时候比例为1:1

user-scalable=no 禁用缩放功能

maximum-scale=1.0 确保禁用缩放功能后,用户能够滚动屏幕

2.

img的class 设置

<img src="#" class="img-responsive"/>

确保图片宽度100%,高度自适应

3.

container容器

<div class="container">
...
</div>

确保里面的内容居中显示

4.

网格系统

先建立行(row),然后在行里面建立列(col),可以扩展到12列,根据屏幕大小的不同设置列的宽度

<div class="row">
<div class="col-md-4"><div>
<div class="col-md-8"><div>
<div>

列分类  xs <768px    sm >=768px   md >= 992px  lg >=1200px

col-md-offset-*  偏移值

col-md-push-*  排序?往右移动格数

col-md-pull-*  排序?往左移动格数

5.

class="clearfix"  清除浮动

 

Bootstrap-1

原文:http://www.cnblogs.com/seakwan/p/4342998.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!