zoukankan      html  css  js  c++  java
  • Bootstrap学习第二天轮播插件

    Bootstrap不仅提供了整套的样式,还提供了一系列插件,帮助开发者构建更受欢迎的网站。

    Bootstrap的轮播插件用起来很简单,代码如下。

    <!DOCTYPE html>

    <html lang="en">

      <head>

        <meta charset="utf-8">

        <title>Bootstrap, from Twitter</title>

        <meta name="viewport" content="width=device-width, initial-scale=1.0">

        <meta name="description" content="">

        <meta name="author" content="">

        <link href="bootstrap/css/bootstrap.css" rel="stylesheet">

        <link href="bootstrap/css/bootstrap-responsive.css" rel="stylesheet">

      </head>

      <body>

    <div id="myCarousel" class="carousel slide">

      <ol class="carousel-indicators">

        <li data-target="#myCarousel" data-slide-to="0" class="active"></li>

        <li data-target="#myCarousel" data-slide-to="1"></li>

        <li data-target="#myCarousel" data-slide-to="2"></li>

      </ol>

      <!-- Carousel items -->

      <div class="carousel-inner">

         <div class="item active">

                        <img src="Demo_lunbo1.jpg" alt="">

                        <div class="carousel-caption">

                          <h4>八月十五回家拍摄</h4>

                          <p>八月十五回家时正赶上下雨,雨后的天空挂上了彩虹</p>

                        </div>

                      </div>

                      <div class="item">

                        <img src="Demo_lunbo2.jpg" alt="">

                        <div class="carousel-caption">

                          <h4>眼睛里的景色更迷人</h4>

                          <p>照片中的彩虹总不如眼睛看到的美。</p>

                        </div>

                      </div>

                      <div class="item">

                        <img src="Demo_lunbo3.jpg" alt="">

                        <div class="carousel-caption">

                          <h4>雨后的黄昏</h4>

                          <p>美好的东西总是短暂的,一会天就黑了。</p>

                        </div>

                      </div>

      </div>

      <!-- Carousel nav -->

      <a class="carousel-control left" href="#myCarousel" data-slide="prev">&lsaquo;</a>

      <a class="carousel-control right" href="#myCarousel" data-slide="next">&rsaquo;</a>

    </div>

        <script src="bootstrap/js/jquery.js"></script>

            <script src="bootstrap/js/bootstrap.js"></script>

      </body>

    </html>

     

  • 相关阅读:
    当spark遇见hbase
    激活函数
    scala的插值器
    sql语句基础
    机器学习中的归一化方法
    sklearn的使用
    sonarqube报错Cause: java.sql.BatchUpdateException: Incorrect string value: 'xF2xB4xB0xBFxDAxBE...' for column 'message' at row 38
    soanrqube 语言插件下载
    sonarqube扫描报错:Caused by: com.mysql.jdbc.PacketTooBigException: Packet for query is too large (4522715 > 4194304). You can change this value on the server by setting the max_allowed_packet' variable.
    xcode11 xcrun altool 自动上传ipa到app store 报错A Distribution Provisioning profile should be used when submitting apps to the App Store. For more information
  • 原文地址:https://www.cnblogs.com/stjwy/p/5947670.html
Copyright © 2011-2022 走看看