Bootstrap之輪播圖

<!--輪播圖-->

            Bootstrap 輪播（Carousel）插件是一種靈活的響應式的向站點添加滑塊的方式。除此以外，內容也是足夠靈活的，能夠是圖像、內嵌框架、視頻或者其餘您想要放置的任何類型的內容。

            <div class="carousel slide" id="myCarousel">//建立一個輪播圖容器

                <!--1.小圓點page-->

                <ol class="carousel-indicators">

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

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

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

                </ol>

                <!--2.圖片-->

                <div class="carousel-inner" id="img1">

                    <div class="item active">

                        <img src="http://imga1.pic21.com/bizhi/140212/07423/s10.jpg" />

                    </div>

                    <div class="item">

                        <img src="http://imga1.pic21.com/bizhi/140212/07423/s07.jpg" />

                    </div>

                    <div class="item">

                        <img src="http://imga1.pic21.com/bizhi/140118/06772/s05.jpg" />

                    </div>

                </div>

                <!--3.左右導航-->

                <!--hammer.js-->

                <a class="carousel-control left" data-slide="prev" href="#myCarousel">⬅️</a>

                <a class="carousel-control right" data-slide="next" href="#myCarousel">➡️️</a>

            </div>