为了账号安全,请及时绑定邮箱和手机立即绑定

原来图片可以滚动的,只是在这个页面试不出来,我还特意把代码复制出去了

<!DOCTYPE html>

<html>

<head>

<meta charset="utf-8">

<meta http-equiv="X-UA-Compatible" content="IE=edge">

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

<title>Hello World</title>

 <link href="//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css" rel="stylesheet">

<style>

.carousel {

            height: 500px;

        }

        .carousel .item {

            height: 500px;

        }

        .carousel .item img {

            width: 100%;

        }

</style>

</head>


<body>

<div id="ad-carousel" class="carousel slide" data-ride="carousel">

  <ol class="carousel-indicators">

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

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

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

  </ol>

  <div class="carousel-inner">

    <div class="item active">

      <img src=" http://img1.sycdn.imooc.com//5412ad400001e52014280484.jpg" alt="1 slide">

  <div class="container">

  <div class="carousel-caption">

   <p>11 英寸 MacBook Air 充电一次可运行长达 9 小时,而 13 英寸机型则可运行长达 12 小时。</p>

</div> 

  </div>

    </div>

    

       <div class="item">

      <img src="http://img1.sycdn.imooc.com//5412ad7c0001d2eb10880541.jpg" alt="1 slide">

  <div class="container">

  <div class="carousel-caption">

   <p>无论是什么任务,配备 Intel HD Graphics 5000 图形处理器的第四代 Intel Core 处理器都能应对自如。</p>

</div> 

  </div>

    </div>

    

     <div class="item">

      <img src="http://img1.sycdn.imooc.com//5412ae5c0001653b12800644.jpg" alt="1 slide">

  <div class="container">

  <div class="carousel-caption">

   <p> 有了新一代 802.11ac 技术,MacBook Air 令 Wi-Fi 速度超越极限。</p>

</div> 

  </div>

    </div>

</div>

    

         <a class="left carousel-control" href="#ad-carousel" data-slide="prev">

    <span class="glyphicon glyphicon-chevron-left"></span>

  </a>

  <a class="right carousel-control" href="#ad-carousel" data-slide="next">

    <span class="glyphicon glyphicon-chevron-right"></span>

  </a>

    </div>


<script src="http://libs.baidu.com/jquery/1.9.0/jquery.js"></script>

    <script src="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script>

</body>

</html>


正在回答

2 回答

还有css文件


0 回复 有任何疑惑可以回复我~

你的js文件导错了吧

<!DOCTYPE html>


<html>


<head>


<meta charset="utf-8">


<meta http-equiv="X-UA-Compatible" content="IE=edge">


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


<title>Hello World</title>


 <link href="http://netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css" rel="stylesheet">


<style>


.carousel {


            height: 500px;


        }


        .carousel .item {


            height: 500px;


        }


        .carousel .item img {


            width: 100%;


        }


</style>


</head>




<body>


<div id="ad-carousel" class="carousel slide" data-ride="carousel">


  <ol class="carousel-indicators">


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


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


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


  </ol>


  <div class="carousel-inner" role="listbox">


    <div class="item active">


      <img src=" http://img1.sycdn.imooc.com//5412ad400001e52014280484.jpg" alt="1 slide">



  <div class="carousel-caption">


   <p>11 英寸 MacBook Air 充电一次可运行长达 9 小时,而 13 英寸机型则可运行长达 12 小时。</p>


</div> 


    </div>

    <div class="item">


      <img src="http://img1.sycdn.imooc.com//5412ad7c0001d2eb10880541.jpg" alt="1 slide">


  <div class="carousel-caption">


   <p>无论是什么任务,配备 Intel HD Graphics 5000 图形处理器的第四代 Intel Core 处理器都能应对自如。</p>


</div> 


    </div>

    <div class="item">


      <img src="http://img1.sycdn.imooc.com//5412ae5c0001653b12800644.jpg" alt="1 slide">


  <div class="carousel-caption">


   <p> 有了新一代 802.11ac 技术,MacBook Air 令 Wi-Fi 速度超越极限。</p>


</div> 


    </div>


</div>


    


         <a class="left carousel-control" href="#ad-carousel" data-slide="prev">


    <span class="glyphicon glyphicon-chevron-left"></span>


  </a>


  <a class="right carousel-control" href="#ad-carousel" data-slide="next">


    <span class="glyphicon glyphicon-chevron-right"></span>


  </a>


    </div>




<script src="http://cdn.bootcss.com/jquery/1.11.1/jquery.min.js"></script>


    <script src="http://cdn.bootcss.com/bootstrap/3.2.0/js/bootstrap.min.js"></script>


</body>


</html>


0 回复 有任何疑惑可以回复我~

举报

0/150
提交
取消

原来图片可以滚动的,只是在这个页面试不出来,我还特意把代码复制出去了

我要回答 关注问题
意见反馈 帮助中心 APP下载
官方微信