厦门专业做网站 厦门做网站的公司 厦门做服饰网站/cnzz统计

 在使用bootstrap框架的时候，发现如下情况：

1、在使用bootstrap的过程中发现只要是使用row这个class，则div每次都是都是超过100%,出现滚动条

2、如果是在<div class="container-fluid">控件下面，则不会出现滚动条

查看了bootstrap的 row 和 container-fluid的class样式说明: 

/*让div控件显示为100%，然后外边距左右各添加15px，实际上是给div增加30px*/
.row {margin-left: -15px;margin-right: -15px;
}/*container-fluid是让div水平居中，左右内边距为15px*/
.container-fluid {margin-left: auto;margin-right: auto;padding-left: 15px;padding-right: 15px;
}因此在<div class="container-fluid">控件下面，则不会出现滚动条
<div class="container-fluid"><div>container-fluid class占一行，并且向内减小30px；并且左右各减小15px</div><div class="row">row　class占一行，并且向外扩展30px；并且左右各扩展15px;</div>
</div>

自己写了一个demo,代码如下：

<div style="position: absolute;top:50%;left: 50%;border: 1px solid red;height: 300px;width: 300px;"><div style="height: 200px;margin-left: -15px;margin-right:-15px;border: 1px solid blue"></div>
</div>