## 巨幕
这是一个轻量、灵活的组件,它能延伸至整个浏览器视口来展示网站上的关键内容。如果一个网站需要在任何地方展示它的关键内容都可以使用这个类 .jumbotron,它的用法如下:
```html
<div class="jumbotron" >
<h1>大标题</h1>
<p>标题简介</p>
<p><a class="btn btn-primary btn-lg" href="#" role="button">标题详情链接</a></p>
</div>
```
默认样式如下:
![](https://img.kancloud.cn/31/f6/31f6f1359a6ef18cde4ec2157b9da648_1132x378.png)
注意:
**1.** 如果需要改变默认样式,只需给这个类.jumbotron添加属性就可以的到你想要的样式了。
**2.** 如果需要让巨幕组件的宽度与浏览器宽度一致并且没有圆角,请把此组件放在所有`.container`元素的外面,并在组件内部添加一个`.container`元素。
```html
<div class="jumbotron">
<div class="container">
<h1>大标题</h1>
<p>标题简介</p>
<p><a class="btn btn-primary btn-lg" href="#" role="button">标题详情链接</a></p>
</div>
</div>
```
![](https://img.kancloud.cn/f2/4e/f24e8be0ba4e612ae985867a79d944e4_1132x378.png)
- 第一章 . bootstrap介绍
- 第二章 . 全局CSS样式
- 1、总体注意事项
- 2、栅格系统
- 3、排版
- 4、代码
- 5、表格
- 6、表单
- 7、 按钮
- 8、 图片
- 9、辅助类
- 10、响应式工具
- 第三章 . bootstrap相关CSS应用
- 1、CSS媒体查询 @media
- 2、px,em,rem之间的关系和换算方式
- 第四章 . 组件
- 1、Glyphicons 字体图标
- 2、下拉菜单
- 3、按钮组
- 4、按钮式下拉菜单
- 5、输入框组
- 6、导航
- 7、导航条
- 8、路径导航
- 9、分页
- 10、标签
- 11、徽章
- 12、巨幕
- 13、页头
- 14、缩略图
- 15、警告框
- 16、进度条
- 17、媒体对象
- 18、列表组
- 19、面版
- 20、Well
- 第五章 . JavaScript 插件
- 1、JavaScript 插件引入前提
- 2、过渡效果 (transition.js)
- 3、模态框 (modal.js)
- 4、下拉菜单 (dropdown.js)
- 5、滚动监听 (scrollspy.js)
- 6、可切换标签 (tab.js)
- 7、工具提示 (tooltip.js)
- 8、弹出框 (popover.js)
- 9、警告信息 (alert.js)
- 10、按钮 (button.js)
- 11、折叠插件(collapse.js)
- 12、轮播插件(carousel.js)
- 13、Affix插件(affix.js)