来自 金沙js77888 2019-07-04 04:24 的文章
当前位置: 金沙js77888 > 金沙js77888 > 正文

bootstrap图片轮播

<!DOCTYPE html>  <html>      <head>          <title>Bootstrap  js  插件</title>          <meta http-equiv="Content-Type" content="text/html; charset=utf-8">          <link href="../css/bootstrap.min.css" rel="stylesheet" media="screen">          <link rel="stylesheet" href="../css/bootstrap-theme.css" media="all" />          <script type="text/javascript" src="../js/jquery.js"></script>          <script type="text/javascript" src="../js/bootstrap.js"></script>          <style type="text/css">              body {                  width: 800px;                  margin:auto;                  margin-top: 100px;              }          </style>      </head>      <body>          <div id="carousel-example-generic" class="carousel slide" data-ride="carousel">            <!-- Indicators -->            <ol class="carousel-indicators">              <li data-target="#carousel-example-generic" data-slide-to="0" class="active"></li>              <li data-target="#carousel-example-generic" data-slide-to="1"></li>              <li data-target="#carousel-example-generic" data-slide-to="2"></li>            </ol>                      <!-- Wrapper for slides -->            <div class="carousel-inner">              <div class="item active">                <img src="../img/Sunset.jpg" alt="图片 1">   <div class="carousel-caption">                    <h4>Second Thumbnail label</h4>                    <p>Cras justo odio, dapibus ac facilisis in, egestas eget quam. Donec id elit non mi porta gravida at eget metus. Nullam id dolor id nibh ultricies vehicula ut id elit.</p>                  </div>              </div>              <div class="item">                <img src="../img/Water.jpg" alt="图片 2">              </div>              <div class="item">                <img src="../img/Blue.jpg" alt="图片 3">              </div>            </div>                      <!-- Controls -->            <a class="left carousel-control" href="#carousel-example-generic" data-slide="prev">                          </a>            <a class="right carousel-control" href="#carousel-example-generic" data-slide="next">                          </a>          </div>                        </body>  </html>

 


本文由金沙js77888发布于金沙js77888,转载请注明出处:bootstrap图片轮播

关键词: js333国际线路