<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>商城</title>
<link rel="stylesheet" href="css/bootstrap.min.css" />
<script type="text/javascript" src="js/jquery-3.1.1.min.js" ></script>
<script type="text/javascript" src="js/bootstrap.min.js" ></script>
</head>
<body>
<div style="width:70%;height: 542px;position: relative; align="center">
<div id="myCarousel" class="carousel slide" style="width: 100%;height: 442px;">
<!-- 轮播(Carousel)指标 -->
<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)项目 -->
<div class="carousel-inner" style="width: 100%;height: 442px;">
<div class="item active">
<img src="img/carous2.jpg" style="width: 100%;height: 442px;" alt="First slide">
</div>
<div class="item">
<img src="img/carous3.jpg" style="width: 100%;height: 442px;" alt="Second slide">
</div>
<div class="item">
<img src="img/carous4.jpg" style="width: 100%;height: 442px;" alt="Third slide">
</div>
</div>
<!-- 轮播(Carousel)导航 -->
<a class="carousel-control left" href="#myCarousel" data-slide="prev" role="button">
<span class="glyphicon glyphicon-chevron-left" aria-hidden="true"></span>
<span class="sr-only">Previous</span>
</a>
<a class="carousel-control right" href="#myCarousel" data-slide="next" role="button">
<span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span>
<span class="sr-only">Next</span>
</a>
</div>
</html>
转载于:https://my.oschina.net/u/3474012/blog/1510123