Question

我将代码简化为最大化以使其可读。我没有改变任何引导程序文件夹。所以这里是＆＃34;简化＆＃34; HTML页面：

<!DOCTYPE html>
  <head>
    <link href="bootstrap/css/bootstrap.css" rel="stylesheet">
  </head>

  <body>
    <div class="container">

        <div class="col-sm-3">3
          <div class="row">
            <div class="col-sm-1">1</div>
            <div class="col-sm-1">2</div>
            <div class="col-sm-1">3</div>
            <div class="col-sm-1">1</div>
            <div class="col-sm-1">2</div>
            <div class="col-sm-1">3</div>
            <div class="col-sm-1">1</div>
            <div class="col-sm-1">2</div>
            <div class="col-sm-1">3</div>
            <div class="col-sm-1">1</div>
            <div class="col-sm-1">2</div>
            <div class="col-sm-1">3</div>
          </div>
        </div>

    </div>
  </body>
</html>

我的网络浏览器上显示的内容：

3
1 2 3 1 2 3 1 2 3
1 2 3

使用框架CSS脚本，我可以设法看到＆＃34; cut＆＃34;近似地发生在第九列的中间（而不是第12列的末尾）。

有什么想法吗？

Answer 1

如果您想这样做，请删除填充

.col-sm-1{
        padding:0 !important;
    }

新安装的Bootstrap中少于12列

1 个答案: