html - Bootstrap：从 span 中删除左右边距

Answer 1

为了嵌套 span，您需要创建一个新的row-fluiddiv。

编辑：您还希望您的跨度 div 中的链接（如果您制作它们，效果很好display:block;）

这是一些 jsFiddle

<div class="container-fluid">    
    <div class="row-fluid">
        <div class="span8 offset2"> 
            <div class="row-fluid">    <!-- make sure to add this div-->
                <div class="span4">
                    <a href="#">
                        <h2>Box 1</h2>
                        <p>Text here</p>
                    </a>
                </div>
                ...
            </div>
        </div>
    </div>
</div>

<style type="text/css">
    a,a:link {
        display:block;
        background-color:#fff;
    }
</style>

Answer 2

a标签的默认显示是 display:inline;

您只需尝试为该标签添加 display:block

a{display:block}

然后你试试这个

a > .span4 { margin: 0 1.7% };

Answer 3

我建议简单地使用a作为网格片而不是div它包含的。例如：

<a href="#" class="span4">
  <div>
    <h2>Box 1</h2>
    <p>Text here</p>
  </div>
 </a>

而且，此时，您可以选择div完全摆脱包含。

为什么要这样做？好吧，它可以为您提供所需的宽度、填充和边距，而无需编写更多代码。它的语义不亚于将div用作网格块。

Bootstrap 网格系统非常完整，而 Ponraj 的解决方案是编写更多的代码来做一些已经存在的事情。如果您尝试向其添加更多功能，您应该只扩展网格系统。