代码:

<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. PHP数组的使用方法小结

    数组就是一组数据的集合,把一系列数据组织起来,形成一个可操作的整体.数组的每个实体都包含两项:键和值. 一.什么是数组数组就是一组数据的集合,把一系列数据组织起来,形成一个可操作的整体.数组的每个实体 ...

  2. thinkphp实现导航高亮的简单方法

    经常会涉及到关于导航菜单高亮显示的问题,大多是通过配合js或者事先分配变量的方式来实现导航高亮的,这里提供另一种思路参考: <ul class="usermenu"> ...

  3. 简单几何(直线与线段相交) POJ 1039 Pipe

    题目传送门 题意:一根管道,有光源从入口发射,问光源最远到达的地方. 分析:黑书上的例题,解法是枚举任意的一个上顶点和一个下顶点(优化后),组成直线,如果直线与所有竖直线段有交点,则表示能穿过管道. ...

  4. 阿牛的EOF牛肉串[HDU2047]

    阿牛的EOF牛肉串 Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 65536/32768 K (Java/Others)Total S ...

  5. myeclipse下安装svn

    在网上查了一下,安装的方法有几种,这里给大家推荐一种快速安装的方法. //第一步 : 下载 site-1.6.5.zip //===================================== ...

  6. objective-c "performSelector may cause a leak because its selector is unknown".

    #define SuppressPerformSelectorLeakWarning(Stuff) \ do { \ _Pragma("clang diagnostic push" ...

  7. POJ 2342 Label:树形dp

    Anniversary party Time Limit: 1000MS   Memory Limit: 65536K Total Submissions: 6955   Accepted: 4003 ...

  8. Codeforces Round #191 (Div. 2) E题

    状态压缩DP,算sum,本来是枚举的,结果TLE了.. #include <iostream> #include <cstring> #include <cstdio&g ...

  9. 关于JS中作用域的销毁和不销毁的情况总结

    window全局作用域->页面关掉才销毁函数执行会形成私有的作用域 1)作用域的销毁 一般情况下,函数执行形成一个私有的作用域,当执行完成后就销毁了->节省内存空间 2)作用域的不立即销毁 ...

  10. idea_IDEA跑Tomcat异常

    IDEA跑Tomcat异常 具体异常如下 Artifact :war exploded: Server is not connected. Deploy is not avail 根据别人的回答,去掉 ...