文章目录[隐藏]
巨幕(Jumbotron)这是一个轻量、灵活的组件,它能延伸至整个浏览器视口来展示网站上的关键内容。以增加标题的大小,并为登陆页面内容添加更多的外边距(margin)。
巨幕创建步骤
- ■ 创建一个带有 class .jumbotron. 的容器
<div>
- ■ 除了更大的
<h1>
,字体粗细 font-weight 被减为 200px。<div class="jumbotron">
<h1>Hello, world!</h1>
<p>这是一个超大屏幕(Jumbotron)的实例。</p>
<p><a class="btn btn-primary btn-lg" href="http://www.511yj.com/category/classification/bootstrap" role="button">Learn more</a></p>
</div>
如果需要让巨幕组件的宽度与浏览器宽度一致并且没有圆角,请把此组件放在所有
.container
元素的外面,并在组件内部添加一个 .container
元素。这样适合做宽屏的logo.<div class="jumbotron">
<div class="container">
<h1>Hello, world!</h1>
<p>这是一个超大屏幕(Jumbotron)的实例。</p>
<p><a class="btn btn-primary btn-lg" href="http://www.511yj.com/category/classification/bootstrap" role="button">Learn more</a></p>
</div>
</div>