-
动画过渡（Transitions） 默认情况之下，Bootstrap框架中以下组件使用了过渡动画效果： ☑ 模态弹出窗（Modal）的滑动和渐变效果； ☑ 选项卡（Tab）的渐变效果； ☑ 警告框（Alert）的渐变效果； ☑ 图片轮播（Carousel）的滑动效果。 右侧举了一个“模态弹出窗（Modal）的滑动和渐变效果”源代码例子。查看全部
-
模态弹出窗标题查看全部
-
列偏移col-md-offset-* 定义列col-md-*查看全部
-
基础表格：.table 斑马线表格：.table-striped 带边框的表格：.tale-bordered 鼠标悬停高亮的表格：.table-hover 紧凑型表格：.table-condensed 响应式表格：.table-resposive查看全部
-
面板--面板中嵌套表格 优化代码： 在实际应用运中，你或许希望表格和面板边缘不需要有任何的间距。但由于panel-body设置了一个padding：15px的值，为了实现这样的效果。我们在实际使用的时候需要把table提取到panel-body外面： <div class="panel panel-default"> <div class="panel-heading">图解CSS3</div> <div class="panel-body">…</div> <table class="table table-bordered">…</table> <div class="panel-footer">作者：大漠</div> </div>查看全部
-
面板--带有头和尾的面板 <div class="panel panel-default"> <div class="panel-heading">图解CSS3</div> <div class="panel-body">…</div> <div class="panel-footer">作者：大漠</div> </div>查看全部
-
列表组--列表项的状态设置 <div class="list-group"> <a href="##" class="list-group-item active"><span class="badge">5902</span>图解CSS3</a> <a href="##" class="list-group-item"><span class="badge">15902</span>W3cplus</a> <a href="##" class="list-group-item"><span class="badge">59020</span>慕课网</a> <a href="##" class="list-group-item disabled"><span class="badge">0</span>Sass中国</a> </div>查看全部
-
列表组--自定义列表组 <div class="list-group"> <a href="##" class="list-group-item"> <h4 class="list-group-item-heading">图解CSS3</h4> <p class="list-group-item-text">...</p> </a> <a href="##" class="list-group-item"> <h4 class="list-group-item-heading">Sass中国</h4> <p class="list-group-item-text">...</p> </a> </div>查看全部
-
列表组--带链接的列表组 但在Bootstrap框架中，还是采用了另一种实现方式。就是将ul.list-group使用div.list-group来替换，而li.list-group-item直接用a.list-group-item来替换。这样就可以达到需要的效果： <div class="list-group"> <a href="##" class="list-group-item">图解CSS3</a> <a href="##" class="list-group-item"><span class="badge">220</span>Sass教程</a> <a href="##" class="list-group-item">玩转Bootstrap</a> </div>查看全部
-
列表组--基础列表组 <ul class="list-group"> <li class="list-group-item">揭开CSS3的面纱</li> <li class="list-group-item">CSS3选择器</li> <li class="list-group-item">CSS3边框</li> <li class="list-group-item">CSS3背景</li> <li class="list-group-item">CSS3文本</li> </ul>查看全部
-
媒体对象--媒体对象的嵌套查看全部
-
媒体对象--默认媒体对象 <div class="media"> <a class="pull-left" href="#"> <img class="media-object" src="http://img1.sycdn.imooc.com//52e1d29d000161fe06000338-300-170.jpg" alt="..."> </a> <div class="media-body"> <h4 class="media-heading">系列：十天精通CSS3</h4> <div>全方位深刻详解CSS3模块知识，经典案例分析，代码同步调试，让网页穿上绚丽装备！</div> </div> </div>查看全部
-
bootstrap 文本对齐风格 左对齐 left 右对齐 right 居中对齐 center 两端对齐 justify查看全部
-
.text-muted：提示，使用浅灰色（#999） .text-primary：主要，使用蓝色（#428bca） .text-success：成功，使用浅绿色(#3c763d) .text-info：通知信息，使用浅蓝色（#31708f） .text-warning：警告，使用黄色（#8a6d3b） .text-danger：危险，使用褐色（#a94442）查看全部
-
各种进度条查看全部
举报
0/150
提交
取消