Bootstrap Jumbotron

定义和使用

Jumbotron 表示一个大的灰色方框，用于引起人们对某些特殊内容或信息的额外注意。

将 <div> 元素与类 .jumbotron 一起使用以创建一个大的灰色方框：

<div class="jumbotron">
   <h1>蝴蝶教程</h1>
   <div>蝴蝶教程的 Slogan 为：编程始于足下！</div>
</div>

尝试一下

预览结果如下：

蝴蝶教程

蝴蝶教程的 Slogan 为：编程始于足下！

提示：在巨型加速器内，您可以放入几乎任何有效的HTML，包括其他Bootstrap元素/类。

如果要使用不带圆角边框的全宽的灰色方框，请在其中添加 .jumbotron-fluid 类和一个 .container 或 .container-fluid：

<div class="jumbotron jumbotron-fluid">
   <div class="container">
      <h1>蝴蝶教程</h1>
      <div>蝴蝶教程的 Slogan 为：编程始于足下！</div>
   </div>
</div>

尝试一下