Question

我正在使用Bootstrap 3.3.7。我已经使用并向页面添加内容。

当我使用容器流体时，它不会跨越页面上的内容，但会限制页面中心区域的大小。

当我使用容器时发生了同样的事情。它跨越页面的外部＆gt;我的屏幕分辨率是1366 x 768。

这是我用过的代码

    <div class="container">

      <h4>Bootstrap Buttons</h4>

      <!-- The Large size buttons -->
      <p>
        <button type="button" class="btn btn-default btn-lg">Default</button>
        <button type="button" class="btn btn-primary btn-lg">Primary</button>
        <button type="button" class="btn btn-success btn-lg">Success</button>
        <button type="button" class="btn btn-info btn-lg">Info</button>
        <button type="button" class="btn btn-warning btn-lg">Warning</button>
        <button type="button" class="btn btn-danger btn-lg">Danger</button>
        <button type="button" class="btn btn-link btn-lg">Link</button>
      </p>

      <!-- The default size buttons -->
      <p>
        <button type="button" class="btn btn-default">Default</button>
        <button type="button" class="btn btn-primary">Primary</button>
        <button type="button" class="btn btn-success">Success</button>
        <button type="button" class="btn btn-info">Info</button>
        <button type="button" class="btn btn-warning">Warning</button>
        <button type="button" class="btn btn-danger">Danger</button>
        <button type="button" class="btn btn-link">Link</button>
      </p>

      <!-- The small size buttons -->
      <p>
        <button type="button" class="btn btn-default btn-sm">Default</button>
        <button type="button" class="btn btn-primary btn-sm">Primary</button>
        <button type="button" class="btn btn-success btn-sm">Success</button>
        <button type="button" class="btn btn-info btn-sm">Info</button>
        <button type="button" class="btn btn-warning btn-sm">Warning</button>
        <button type="button" class="btn btn-danger btn-sm">Danger</button>
        <button type="button" class="btn btn-link btn-sm">Link</button>
      </p>

      <!-- The small size buttons -->
      <p>
        <button type="button" class="btn btn-default btn-xs">Default</button>
        <button type="button" class="btn btn-primary btn-xs">Primary</button>
        <button type="button" class="btn btn-success btn-xs">Success</button>
        <button type="button" class="btn btn-info btn-xs">Info</button>
        <button type="button" class="btn btn-warning btn-xs">Warning</button>
        <button type="button" class="btn btn-danger btn-xs">Danger</button>
        <button type="button" class="btn btn-link btn-xs">Link</button>
      </p>  

    <!-- Bootstrap container & container-fluid -->
    <!-- Bootstrap container example -->
    <div class="container bootcontainer">
      <h1>Hello, world! - Using Container</h1>
    </div>

    <!-- Bootstrap container-fluid example -->
    <div class="container-fluid bootcontainerfluid">
      <h1>Hello, world! - Using Container Fluid</h1>

    </div>

Answer 1

这是容器，其中包含其他容器，所以：

   <!--Bootstrap Modal (Dialog Box / Pop-up Window) Example-->
      <div class="container-fluid">
       ...

然后将容器替换为容器流体，无论您需要它，都可以为我工作。

Answer 2

我找到了答案。实际上它是一个HTML中断。在声明了“自举按钮示例”之后，我没有放置<div>标签。

非常感谢！

此致 Chiranthaka

Bootstrap Container＆amp;容器液有一个问题

2 个答案: