bootstrap只是提供了一个大方向，实际需求不符合是很正常的。bootstrap也支持用户自己进行相应的修改，如果你对bootstrap的目录结构和文件不熟悉，建议不要直接修改文件，而且那样也不利于扩展，因为如果重新获取bootstrap就没有你手动做的修改了，建议添加带 !important的class属性，在需要的地方覆盖bootstrap的样式即可

1、改.container宽度，改.col-**间距之类
2、悄悄修改设计图

没怎么看出差距啊

Bootstrap设置了 col之间 15px的间距，你手动去掉就知道了。

假设设计稿中间内容的宽度是1000px,每一个小模块中间的间距是20px

@media(min-width:1000px){
    .container 
    {
        width:1000px;
    }
    .row 
    {
        margin-left:-10px;
        margin-right:-10px;
    }
    
    .col-lg-4 
    {
        padding-left:10px;
        padding-right:10px;
    }
}

html的结构应该是

    <p class="container">
        <p class="top"><button class="btn btn-primary">免费公开课</button></p>
        <p class="row">
            <p class="col-sm-6 col-md-4 col-lg-4">
                小模块
            </p>
        </p>
    </p>

bootstrap 是针对要求不高的项目来使用的。如果要求高，使用它完全就是折腾自己。

针对每个item，重写左右边距。或者每三列套在一个row标签中