Bootstrap组件之巨幕、徽章
2015-08-01 23:59
706 查看
.jumbotron——指定div元素包裹巨幕组件;
![](http://img.blog.csdn.net/20150801233810961)
.badge——设置span元素为徽章效果;
<h3>巨幕示例</h3> <div class="jumbotron"> <div class="container"> <h1>中超大结局预测</h1> <p>中超正经历着两周间歇期,但“间歇”的字眼下是各队为赛季收官所进行的冲刺准备。在还剩9轮联赛的情况下,本赛季的大结局已是露出了可供揣测的端倪:争冠集团中,恒大由数据所体现出的稳定性放大着连续第5个赛季夺冠的希望;残酷的保级战线中,辽足与申鑫最有可能成为降级球队。</p> <p class="text-right"><a class="btn btn-primary btn-lg" href="#" role="button">更多</a></p> </div> </div>
.badge——设置span元素为徽章效果;
<h3>徽章示例</h3> <a href="#"><span class="badge">30</span>赞</a> <hr/> <button class="btn btn-primary" type="button">评论<span class="badge">12</span> </button> <hr/> <ul class="nav nav-pills"> <li role="presentation" class="active"><a href="#">浏览数<span class="badge">30</span></a></li> <li role="presentation" ><a href="#">下载量<span class="badge">3</span></a></li> <li role="presentation" ><a href="#">评论数<span class="badge">12</span></a></li> </ul>
相关文章推荐
- BootStrap 按钮
- bootstrap框架以及css一些常见问题
- bootstrap中popover.js(弹出框)使用总结+案例
- bootstrap的学习
- Bootstrap组件之分页
- Bootstrap组件之well、标签
- Bootstrap组件之具有响应式特性的嵌入内容
- Bootstrap (导航、标签、面包屑导航)
- Bootstrap组件之面板
- Bootstrap组件之媒体对象
- BootStrap表单
- BootStrap表格
- Bootstrap 固定定位(Affix)
- Bootstrap carousel轮转图的使用
- Bootstrap组件之导航条
- 基于bootstrap3和jquery的分页插件
- bootstrap布局详解
- 让IE6 IE7 IE8 IE9 IE10 IE11支持Bootstrap的解决方法
- 让Bootstrap 3兼容IE8浏览器
- Bootstrap组件之导航