木馬都在一個圓盤上，不斷地旋轉，有時序性的
木馬總是有不一樣的外表，圖片也不可能都是同一張的
不過包的時候，要注意，別把carousel-control包在carousel slide外面，否則會出現控制按鈕在外，圖片在中間的樣子呢XD
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>Test</title>
<script type="text/javascript" src="http://code.jquery.com/jquery-2.0.3.min.js"></script>
<script src="./js/bootstrap.js"></script>
<link rel="stylesheet" href="./css/bootstrap.css">
</head>
<body>
<div id="slider">
<div id="carousel-example-generic" class="carousel slide">
<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>
</ol>
<div class="carousel-inner">
<div class="item active">
<img src="http://www.wired.com/wiredenterprise/wp-content/uploads/2013/07/ff_googleinfrastructure_large.jpg" title="image1">
<div class="carousel-caption">lable1</div>
</div>
<div class="item">
<img src="http://rack.1.mshcdn.com/media/ZgkyMDEyLzEyLzA0L2M1L2dvb2ZpbmdvZmZvLmJURS5qcGcKcAl0aHVtYgk5NTB4NTM0IwplCWpwZw/fe2369e6/53a/goofing-off-on-a-google-doodle-how-downtime-helps-us-work-better-9e11a95d06.jpg" title="image2">
<div class="carousel-caption">lable2</div>
</div>
</div>
<a class="left carousel-control" href="#carousel-example-generic" data-slide="prev">
<span class="icon-prev"></span>
</a>
<a class="right carousel-control" href="#carousel-example-generic" data-slide="next">
<span class="icon-next"></span>
</a>
</div>
</div>
<style type="text/css">
#slider {
width: 30%;
height: 50%;
}
</style>
</body>
</html>
參考資料：
http://getbootstrap.com/javascript/#carousel
http://repeat.tw/blog/post/22412400