代码:

<div class='container-fluid'>
<h3 class='page-header'>Bootstrap 旋转木马</h3> <div class='carousel slide' id='carousel1'>
<div class='carousel-inner'>
<div class='item active'>
<img src='http://placehold.it/1246x360/FFEB79&text=W3Cschoool1' />
<div class='carousel-caption'>
<h4>W3Cschoool菜鸟教程</h4>
<p>一个提供最新的web技术站点,本站免费提供了建站相关的技术文档,帮助广大web技术爱好者快速入门并建立自己的网站。菜鸟先飞早入行——学的不仅是技术,更是梦想。1</p>
</div>
</div> <div class='item'>
<img src='http://placehold.it/1246x360/FF6600&text=W3Cschoool2' />
<div class='carousel-caption'>
<h4>W3Cschoool菜鸟教程</h4>
<p>一个提供最新的web技术站点,本站免费提供了建站相关的技术文档,帮助广大web技术爱好者快速入门并建立自己的网站。菜鸟先飞早入行——学的不仅是技术,更是梦想。2</p>
</div>
</div> <div class='item'>
<img src='http://placehold.it/1246x360/00EB79&text=W3Cschoool3' />
<div class='carousel-caption'>
<h4>W3Cschoool菜鸟教程</h4>
<p>一个提供最新的web技术站点,本站免费提供了建站相关的技术文档,帮助广大web技术爱好者快速入门并建立自己的网站。菜鸟先飞早入行——学的不仅是技术,更是梦想。3</p>
</div>
</div>
</div>
<a href='#carousel1' data-slide='prev' class='left carousel-control'><font style='font-weight:bold;font-size:40px;'>☆</font></a>
<a href='#carousel1' data-slide='next' class='right carousel-control'><font style='font-weight:bold;font-size:40px;'>★</font></a>
</div>
</div>

代码块经过测试,放心使用

如图:

Bootstrap页面布局24 - BS旋转木马功能的更多相关文章

  1. Bootstrap页面布局3 - BS布局以及流动布局

    1. <h1 class='page-header'>布局<small> 使用bootstrap网格系统布局网页</small></h1> 得到如图所示 ...

  2. Bootstrap页面布局16 - BS导航菜单和其响应式布局以及导航中的下拉菜单

    代码: <div class='container-fluid'> <h2 class='page-header'>导航</h2> <!-- .navrbar ...

  3. Bootstrap页面布局9 - BS列表

    列表: 无序列表(列表中项目内容没有固定的顺序), 有序列表(通常使用在一组有前后顺序的内容上), 描述列表(定义解释一组词汇) 无序列表: <ul> <li>Ueditor编 ...

  4. Bootstrap页面布局18 - BS导航路径以及分页器

    导航路径:又叫“面包屑”,功能是让用户知道所处的位置. <!--面包屑--> <ul class='breadcrumb'> <li><a href='#'& ...

  5. Bootstrap页面布局17 - BS选项卡

    代码结构: <div class='container-fluid'> <h2 class='page-header'>Bootstrap 选项卡</h2> < ...

  6. Bootstrap页面布局14 - BS按钮群组

    首先看看这个代码: <div class='btn-group'> <button type='button' class='btn'>计算机</button> & ...

  7. Bootstrap页面布局23 - BS折叠内容

    <div class='container-fluid'> <h3 class='page-header'>Bootstrap 折叠内容</h3> <!--如 ...

  8. Bootstrap页面布局22 - BS工具提示

    当鼠标点击在一个a连接上时,显示提示文字的效果 ----------------  tooltip <div class='container-fluid'> <h3 class=' ...

  9. Bootstrap页面布局20 - BS缩略图

    <div class='container-fluid'> <h2 class='page-header'>Bootstrap 缩略图</h2> <ul cl ...

随机推荐

  1. oracle 10g 学习之单行函数(5)

    目标 通过本章学习,您将可以: l  SQL中不同类型的函数. l  在 SELECT 语句中使用字符,数字和日期函数. l  描述转换型函数的用途. 字符函数 字符函数分为大小写控制函数和字符控制函 ...

  2. javascript集合的交,并,补,子集的操作实现

    可能新的ECMA规范里已有了这些的实现, 但能自己从头开始实现,感觉也非常不错的哟... function Set() { var items = {}; this.has = function(va ...

  3. 被忽视但很实用的那部分SQL

    一.前言 虽然我们大多数人都学习过SQL,但是经常忽略它.总是会自以为学到的已经足够用了,从而导致我们在实际开发的过程中遇到复杂的问题后只能在检索数据后通过传统的代码来完成,但是其中很多的功能利用SQ ...

  4. [译] 在Web Forms 中使用ASP.NET Routing

    本文将以最少的代码想你展示一下的效果: 自定义RUL而不依赖于物理文件名. 使用标记或者代码产生基于route 参数的URL . 如何获得标记或者代码路由过来的参数. 创建Routes void Ap ...

  5. hdu 1754 单点更新

    题意:很多学校流行一种比较的习惯.老师们很喜欢询问,从某某到某某当中,分数最高的是多少.这让很多学生很反感.不管你喜不喜欢,现在需要你做的是,就是按照老师的要求,写一个程序,模拟老师的询问.当然,老师 ...

  6. Windbg 双机代码同步调试设置

    Windbg的设置 Windbg的设置 Windbg本身可以直接从微软的网站上下载下载地址:http://www.microsoft.com/whdc/devtools/debugging/defau ...

  7. Spring的profile属性

    使用示例 //注解方式 public class DataSourceConfig { @Bean @Profile("prod") public DataSource dataS ...

  8. jquery优化02

    缓存变量:DOM遍历是昂贵的,所以尽量将会重用的元素缓存. $element = $('#element'); h = $element.height(); //缓存 $element.css('he ...

  9. Revit二次开发示例:ErrorHandling

    本示例介绍了Revit的错误处理.   #region Namespaces using System; using System.Collections.Generic; using Autodes ...

  10. ZOJ 3908 Number Game ZOJ Monthly, October 2015 - F

    Number Game Time Limit: 2 Seconds      Memory Limit: 65536 KB The bored Bob is playing a number game ...