Bootstrap カルーセル(スライドショー)

Previous



Next

<div
　id="carousel-example-generic"
　class="carousel slide"
　data-ride="carousel"
　data-interval="3000">
　<!– ○●ボタン –>
　<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>
　<!– スライドの内容 –>
　<div class="carousel-inner" role="listbox">
　　<div class="item active">
　　　<img src=(画像1) width=～; height=～; />
　　</div>
　　<div class="item">
　　　<img src=(画像2) width=～; height=～; />
　　</div>
　　<div class="item">
　　　<img src=(画像3) width=～; height=～; />
　　</div>
　</div>
　<!– 左右の移動ボタン –>
　<a class="left carousel-control"
　　href="#carousel-example-generic" role="button"
　　data-slide="prev">
　　<span class="glyphicon glyphicon-chevron-left"
　　　aria-hidden="true"></span>
　　<span class="sr-only">Previous</span>
　</a>
　<a class="right carousel-control"
　　href="#carousel-example-generic"
　　role="button"
　　data-slide="next">
　　<span class="glyphicon glyphicon-chevron-right"
　　　aria-hidden="true"></span>
　　<span class="sr-only">Next</span>
　</a>
</div>