Bootstrap 3 Jumbotron有圆形边缘（我如何摆脱他们？）

Question

在Bootstrap 3中，.jumbotron具有圆边（默认情况下）。有没有办法摆脱圆形边缘？ （下面的圆边图片供参考）

Answer 1

Bootstrap 3 Jumbotron有类：

.container .jumbotron {
    border-radius: 6px ;
}

您需要将其设置为border-radius：0px;，但我建议将相同的类添加到单独的样式表（在bootstrap.css之后调用）并覆盖它，而不是直接更改bootstrap.css文件。

.container .jumbotron {
    border-radius: 0 !important;
}

Answer 2

要摆脱圆形边缘，请使用.jumbotron-fluid和.jumbotron并将容器放入其中，如here所述

 <div class="jumbotron jumbotron-fluid">
   <div class="container">
    ...
   </div>
 </div>

Answer 3

Bootstrap建议低于here

为了使jumbotron全宽，没有圆角，将它放在所有.container之外，而是在其中添加.container。

<div class="jumbotron">
  <div class="container">
    ...
  </div>
</div>

Answer 4

如果您还没有这样做，请确保Jumbotron类位于容器之前。

EX。

<div class="jumbotron">
<div class="container-fluid>