Question

我聘请了某人来实施网站设计。他正在使用bootstrap 3（我之前在一些项目中使用过）并且让我感到惊讶的是他避免在每个网格和子网格中使用.row类（他使用clearfix来制作行）。他的代码看起来像这样...

<div class="container">
    <div class="col-md-7">
        <ul>
            <li><a>item 1</a></li>
            <li><a>item 2</a></li>
            <li><a>item 3</a></li>
        </ul>
    </div>
    <div class="col-md-5 pull-right">
        <ul class="nav nav-tabs">
            <li><i class="fa fa-users" aria-hidden="true"></i>Menu item 1</li>
            <li class="shop">Item 2</li>
        </ul>
    </div>
    <div class="clearfix"></div>
</div>

根据我的阅读，.row类习惯了

“创建水平的列组。” source
“row通过在左侧和右侧使用-15px的负边距值来取消容器元素设置的填充。” source

在网格结构中不使用此类有什么影响？我应该确保他使用.row类吗？

感谢

Answer 1

来自bootstrap docs

行必须放在.container（固定宽度）或 .container-fluid（全宽），用于正确对齐和填充。

你也是正确的.row从容器中清除排水沟，左边和右边有15px。

.container {
    padding-right: 15px;
    padding-left: 15px;
}

.row {
    margin-right: -15px;
    margin-left: -15px;
}

因此，我个人会谨慎行事，并遵循bootstrap规定的要求。在将来，框架可能会发生变化，并且可以在行类上创建强大的依赖性，并且由于代码中缺少该框架，因此需要对其进行重新更新以更新版本...或者可选地，您可以选择实现响应式选择器，例如为.col-xs-，可以超过或低于12列网格格式。

在Bootstrap 3网格结构中不使用.row类的影响

1 个答案: