この記事の主な内容は、ナビゲーションバーの下にカルーセルの写真を作成して、参照の最新の重要なニュースを自動的に再生することです。特定のコンテンツは次のとおりです
1。レスポンシブカルーセル図
//レスポンシブカルーセル図
<div id = "mycarousel"> <ol> <li data-target = "＃mycarousel" data-slide-to = "0"> </li> <li data-target = "＃mycarousel" data-slide-to = "1"> </li> <li date-target = "＃mycarousel"＃mycarousel "data-slide =" style = "背景：＃223240;"> <a href = "＃"> <img src = "img/slide1.png"> </a> </div> <div style = "背景：＃f5e4dc;" style = "background：＃de2a2d;"> <a href = "＃"> <img src = "img/slide3.png"> </a> </div> </div> </div> </a href = "＃mycarousel"＃mycarousel "slide =" pred "> ‹</a> <a href ="
//必要なjQueryコントロール
$（ '＃mycarousel'）。Carousel（{//自動再生/2秒間隔：3000、}）;//カルーセル矢印の位置を調整します
$（'。Carousel-Inner img '）。eq（1）.height（）|| $（'。Carousel-Inner img '）。eq（1）.height（）|| $（'。CAROUSEL-INNER IMG '）。eq（2）.height（）; $（'。CAROUSEL-INNER IMG '）。eq（2）.height（）; $（'。CAROUSEL-INNER IMG '）。eq（2）.height（）; $（'。Carousel-Control '）。css（' line-height '、$ height +' px '）;}）;
//必要なCSS
A：Focus {outline：none;}。Navbar-brand {padding：0;}＃mycarousel {margin：50px 0 0 0;}。それでも詳細に学びたい場合は、ここをクリックして素晴らしいトピックを学び、添付できます。BootstrapLearning Tutorial Bootstrap Practical Tutorial
素晴らしいトピックの共有：jQueryの写真カルーセルjavascript写真カルーセルブートストラップ写真カルーセル
上記はこの記事のすべての内容です。みんなの学習に役立つことを願っています。誰もがwulin.comをもっとサポートすることを願っています。