html – Twitter Bootstrap 3删除一行和第12列的右边距和填充

发布时间：2020-12-14 21:45:26 所属栏目：资源来源：网络整理

导读：我在Asp.Net MVC 5项目中使用Twitter Bootstrap 3.0 LESS源代码。我使用顶级导航栏( as given here)，然后在布局页面中再添加几行。我使用以下行来获取100％的页面宽度： div class="row" div class="col-md-12" // More HTML code /div/div 但是这会在每行

我在Asp.Net MVC 5项目中使用Twitter Bootstrap 3.0 LESS源代码。我使用顶级导航栏( as given here)，然后在布局页面中再添加几行。

我使用以下行来获取100％的页面宽度：

<div class="row">
    <div class="col-md-12">
        // More HTML code
    </div>
</div>

但是这会在每行的右侧添加一个额外的填充。这也向页面添加了一个水平滚动条，当页面向右滚动时，整个页面中的空白垂直槽是可见的。

删除所有栏目12上的每一行和右侧填充右边的边距校正布局。但是，我不觉得这是正确的做法。

任何想法如何删除那些不必要的边距和填充在所有的一切，在整个结果的bootstrap.css？

解决方法

您的问题是由.container类不包括.rows引起的。

尝试这个：

<div class="container" style="width:100%;background-color:blue;">
<div class="row" style="background-color:green;">
    <div class="col-md-12" style="background-color:red;">
       <div style="background-color:yellow;">test test test</div>
    </div>
</div>
</div>

宽度：100％;在你的.container将使行100％(红色)。仍然会在您的内容周围填充(黄色)。这个填充是电网的沟槽，见：http://stackoverflow.com/a/19044326/1596547

No,this does not help. The padding-right on col-md-12 still prevails.
I seek something generic implemented in .less source for any column
type (col-*-12)!

所有col – * – *的两边填充为15px。 * -12类之间没有区别，除了* -12类以外没有浮点数。

所有col- *类的css / less选择器：

[class^="col-"] {
  padding-left: 0;
  padding-right: 0;
}

css / less选择器为所有你的col – * – 12类：

[class$="-12"]
{
  padding-left: 0;
  padding-right: 0;
}

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!