今回は、JSコンポーネントの使用をご覧ください。この記事は少し長くなります。誰もが辛抱強くそれを読むことができればいいのですが、多くの利益があると思います。多くの庭の友人が私を友達に追加し、私の執筆スタイルのように表現しました。シンプルで明確です。ここで、あなたのサポートをもう一度ありがとうございます。一方で、私自身のテクノロジーは限られており、私は比較的基本的なものを書きます。一方、私は自分の理解に基づいて物事を書き、最も単純な言語で複雑なことを表現します。したがって、執筆に何か問題がある場合は、修正を行ってください。
1。JSファイル参照
注:他のプラグインがjQueryに依存しているため、jQueryは他のJSファイルの前に導入する必要があります。
<! - <script src = "js/jquery-1.11.3.min.js"> </script>ローカルインポートロードファイル - > <スクリプトsrc = "http://cdn.bootcss.com/jquery/1.11.3/jquery.min.js"> </< src = "js/bootstrap.min.js"> </script>
2。データ属性
関数:データ属性を介して、JSコードを作成せずにBootstrapプラグインを使用できます。 Data-Toggle = "Dropdown"やその他の参照メニューなど、前述の参照メニュープラグイン。
ターンオン機能があるので、関数をオフにする方法は?次のコードをJavaScriptに追加します。
<script type = "text/javascript"> $(document).off( '。data-api'); </script>
特定のプラグインの機能をオフにする場合は、次のコードを追加します。
<script type = "text/javascript"> //プロンプトボックス$(document).off( '。alert.data-api')のプラグイン関数を閉じる; </script>
すべてのJSプラグインは基本的に次の手順です。
1:使い方は? ---対応するクラスを書く方法は?
2:電話する方法は? ---クラスを書いた後、クラスを作成する方法は有効になりますか?
3:イベント処理 - アクションが開始された後にアクションがトリガーされ、発生する前に発生することを含む
注:すべてのアクションはトリガー前に発生します。BootstrapはPreventDefaultを提供します。これにより、アクションが実行される前に停止することが実装されます。コードは次のとおりです。
$( '#myModal')
注: Bootstrapは、JavaScriptを無効にするブラウザの是正措置を講じません。したがって、私たちは自分自身を修復するためにコードを書く必要があり、誰もがそれを知っていると思います。
<NoScript>ブラウザはJavaScriptをサポートしていません。最新のブラウザをダウンロードしてください</noscript>
3。モーダルボックスコンポーネント(Modal.js)
注記:
1:複数のモーダルボックスを同時に開くことはサポートされていません
2:モーダルボックスは、モーダルボックスのディスプレイと機能に影響を与える他のコンポーネントを避けるために、できるだけ体の子要素に配置する必要があります。
3:モバイル端末の命令
4:アクセシビリティを強化します - ADDロール属性
5:ビューはモーダルボックスに埋め込むことができます。つまり、data-toggle = "modal"
以下の列を見てみましょう。ボタンをクリックすると、モーダルボックスがポップアップ表示されます。ここのプロパティに関しては、前の記事を読んだことがあるなら、理解するのは難しいことではないと思います。ここでは詳しく説明しません。コードを投稿して自分でテストできます。
<!doctype html> <html lang = "zh-cn"> <head> <meta charset = "utf-8"> <meta http-equiv = "x-ua互換" content = "ie = edge"> <meta name = "viewport" content = "width =" width = bed "他のコンテンツは *それらに従う必要があります! - > <title> </title> <link href = "css/bootstrap.css" rel = "styleSheet"> <link href = "css/bootstrap.min.css" rel = "styleSheet"> <link href = "css/style.css" lele = "styleSeet"> head> <button> <button "" data-toggle = "Modal" data-target = "。bs-example-modal-lg">大きなモーダルボックスがポップアップします</button> <div id = "mymodal" tabindex = "-1" lole = "dialog" aria-labelledby = "mylargemodallabel"> aria-label = "close"> <span aria-hidden = "true">×</span> </button> <h4>モーダルタイトル</h4> </div> <div> <p> 1つの細かいボディ…</p> </div> <div> <ボタンタイプ= "ボタン" button "data-dismiss =" modal "> </div> </div> <! - モーダルボックスのサイズを変更し、クラスモーダル-SMを追加します - > <ボタン= "ボタン" data-toggle = "Modal" data-target = "。bs-example-modal-sm">小さなモーダルボックスがポップアップ</button> <div id = "mymodal" tabindex = "-1" -1 "ダイアログ" aria-labelledby = "mylargemodallabel"> <div> ---小さなモーダルボックス<div> <div> <ボタンタイプ= "button" data-label = "close"> <span aria-hidden = "true">×</span> </button> <h4> h4> div </div </div </div </div < <div> <button type = "button" data-dismiss = "modal"> close </button> <button type = "button"> save change </button> </div> </div> </div> </div> </div> <! - アニメーション効果は禁止されています。 src = "http://cdn.bootcss.com/jquery/1.11.3/jquery.min.js"> </scrip> <script src = "js/bootstrap.min.js"> </script> <script type = "text/javascript"> $( "#mymodal")。 ---このコードを呼び出してプラグインを機能させる</script> </body> </html>
効果は次のとおりです。
モーダルボックスと組み合わせることで、フォームなどに埋め込まれた入力ボックスなど、ボディコンテンツに他の機能を追加することもできます。ここにはコードは投稿されていません。
モーダルボックスのイベントについては、以下に示すように、次のコードをJavaScriptに追加します。
コードを次のようにコピーします。<スクリプトsrc = "http://cdn.bootcss.com/jquery/1.11.3/jquery.min.js"> </script> <script> <script src = "js/bootstrap.min.js"> </script> <script = "mymodal")。 ---このコードを呼び出してプラグインモーダルボックスを有効にし、$( '#mymodal')を表示します。
アラート( "111");
})---このイベントは、モーダルボックスを閉じた後にアラートイベントがトリガーされることを意味します</script>
モーダルボックスがビデオにどのように埋め込まれているかを見てみましょう。コード、自動再生、停止、その他の機能を追加する必要があります。最初にコードを見てみましょう
<a href = "#" data-toggle = "modal" data-target = "#videomodal" data-thevideo = "http://v.youku.com/v_show/id_xmtu2odmimduymymymymymymymymymymyma = = = = html"> video </a> aria-labelledby = "videoModal" aria-hidden = "true"> <div> <div> <div> <ボタンタイプ= "button" data-dismiss = "modal" aria-hidden = "true">×</button> <div> <iframe src = ""> </iframe> </div> div </div </< src = "js/jquery-1.11.3.min.js"> </scrip>ローカルロードファイル - > <スクリプトsrc = "http://cdn.bootcss.com/jquery/1.11.3/jquery.min.js"> </script src = " type = "text/javascript"> // view function autoplaymodal(){var trigger = $( "body")。find( '[data-toggle = "modal"]'); trigger.click(function(){var themodal = $(this).data( "ターゲット"); var videosrc = $(this).attr( "data-thevideo"); var videosrcauto = videosrc+"?autoplay = 1"; $(hemodal+'iframe)。 button.close ')。click(function(){$(hemodal+' iframe ')。 }); }); }); } // function $(document).ready(function(){autoplaymodal();}); </script> <noscript> JavaScriptブラウザー</noscript>をサポートしません効果はもはやスクリーンショットではなく、上記のSRCはYoukuのアドレスを紹介します。
4。監視コンポーネントのスクロール
ナビゲーションバーにリストされているのは、スクロール位置に応じてタブを自動的に切り替えます。コードを見てみましょう。
1:スクロールバーが表示されていることを確認してください。
2:通常、ボディにデータスパイを追加します。つまり、data-spy = "scroll" <body data-spy = "scroll" data-target = "。navbar" data-offset = "70"> <div id = "myscrollspy"> <nav role = "navigation"> <div> <div id = "navbar-scroll" <li> <a href = "#message"> message </a> </li> <li> <a href = "#about"> bout </a> </li> <li> <a href = "#about"> bout </a> </li> <li> <a href = "#"# "date-toggle =" dropdown " href = "#one"> one </a> <li> <a href = "#two"> 2 </a> <li> <lif = "#3"> 3つ</a> </ul> </li> </ul> </div> </nav> <! - ショーケースコンテンツ - > <h1 id = "> home </h1> <p>111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111 111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111 1111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111 11111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111 1111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111 11111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111 <p>1111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111 11111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111 11111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111 11111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111 id = "about"> about </h1> <p>11111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111 11111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111 11111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111 11111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111 <hr> <h1 id = "one"> one </h1> <p>111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111 1111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111 111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111 1111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111 </p> <h1 id = "two"> 2 </h1> <p>11111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111 111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111 111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111 111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111 1111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111 11111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111 1111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111 11111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111 1111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111 11111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111 1111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111 11111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111 1111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111 11111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111 1111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111 11111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111
データオフセットの意味を理解します。つまり、スクロール位置があるときの上からのオフセット。第二に、そのイベント処理はモーダルボックスの使用に似ており、説明しません。
効果は次のとおりです。
5。プロンプトボックスコンポーネント
知らせ:
1:data-toggle = "tooltip"を使用します
2:データの配置はプロンプトボックスの方向を表し、左、右、下、上部の4つの方向があります
3:データアミメーションは、アニメーション効果をFalseに設定することです。つまり、マウスが移動した後、バッファリング効果なしに、元の段階的な内外から瞬時に変化します。
<div> <p> <! - easing->これはテストタイトルです。 src = "js/jquery-1.11.3.min.js"> </scrip>ローカルロードファイル - > <スクリプトsrc = "http://cdn.bootcss.com/jquery/1.11.3/jquery.min.js"> </script> <script> <script.min.js "> type = "text/javascript"> $( '[data-toggle = "tooltip"]')。tooltip(); //初期化$( '#clickevent')。表示されます})</script>
6。ポップアップフレームコンポーネント
知らせ:
1:ポップアップボックスは、任意の要素に小さな吊り下げレイヤーを追加して、非メイン情報を保存します。
2:コンテンツの長さが0の場合、ポップアップボックスは表示されません。 Data-toggle = "Popover"を使用します
3:プロンプトボックスプラグインに依存すると、手動で初期化する必要があります(JavaScriptの初期化を参照)
次のコードとスクリーンショットはもうありません。
次のようにコードをコピーします。<! - ボタンをクリックしてポップアップし、ボタンをクリックして非表示にします - >
<button type = "button" data-toggle = "Popover" data-content = "そして、ここにいくつかの素晴らしいコンテンツがあります、それは非常に魅力的ですよね?">私をクリックしてポップアップボックスをポップ/非表示
ボタンをクリックすると表示されてから、ボタンをクリックして消えます。空白のスペースでクリックして隠したい場合はどうすればよいですか?
データトリガー= "フォーカス"を追加するだけで、フォーカスを隠すとトリガーがトリガーを意味します。
次のようにコードをコピーします。<! - ボタンをクリックしてポップアップし、空白スペースをクリックして非表示にします。 Aタグを使用するのが最善です。もちろん、ボタンを使用することもできます - >
<a tabindex = "0" id = "mypopover" role = "button" data-toggle = "Popover"
data-trigger = "focus" data-content = "そしてこれは美しいコンテンツ">私をクリックして消える</a>
7。警告ボックスコンポーネント
知らせ:
1:data-dismiss = "alert"を使用します
2:プラグインはクリックを追加して警告メッセージに消えます
3:閉じるボタンを使用する場合、つまり、閉じるクラスが使用される場合、それはアラートの最初の子要素である必要があり、テキストがその前に表示されることは許可されていません。
コードを見てみましょう:
<! - 警告ボックス - > <div id = "myalert"> <ボタンタイプ= "ボタン" data-dismiss = "alert" aria-label = "close"> <span aria-hidden = "true">×</span> </button> <span> welcome </span> <ボタンタイプ= "ボタン" aria-label = "close"> <span aria-hidden = "true">×</span> </button> <span> welcome </span> <button type = "button">詳細</button> </div>
JavaScriptに複数の警告ボックスがあり、警告ボックスを閉じたい場合は、次のようにJavaScriptに次のコードを追加します。
$( "#myalert")。alert( 'close')//最初の警告ボックスが閉じられた場合、または#myalertが#myalert1に置き換えられた場合、2番目の警告ボックスは$( '#myalert1')を閉じます。
8。ボタンコンポーネント
知らせ:
1:ボタンのステータスを切り替えます(無効または電源を入れます) - これは、autocomplete = "off"を使用して達成されます
2:ツールバーなどに複数のボタンを作成します。
3:データロードテキスト=「ロード...」を設定して、読み込みステータスを設定します。
<! - button-> <button type = "button" id = "mybutton" data-loading-text = "loading ..." autocomplete = "off"> loading state </button> <button "button" data-toggle = "button" aria-pressen type = "Checkbox" autocomplete = "off" checked> home </label> <label> <入力タイプ= "Checkbox" autocomplete = "off"> message </label> <label> <input type = "Checkbox" autocomplete = "off">プロフィール</label> </div>
ボタンをクリックした後にコンテンツを変更する場合は、データComplete-text = "xxxx"を追加し、次のようにJavaScriptコードを追加します。
次のようにコードコードをコピーします。<! - [トリガー]をクリックした後、コンテンツデータコンプレットテキストを変更すると、完成したコンテンツを表します - >
<button type = "button" button "data-complete-text =" finish "autocomplete =" off "> [</button> <script> $( '。mybtn')をクリックした後、コンテンツは自動的に変更されます。
状態を切り替えるためにボタンを設定し、状態を切り替える時間を設定するには、次のコードをJavaScriptに追加できます。
<script> $( '#mybutton')。
9。折り畳みフレームアセンブリ
注: data-toggle = "崩壊"を使用して、コードを確認します。
<aLole = "button" data-toggle = "collapse" href = "#collapsexample" aria-expanded = "false" aria-controls = "collapseexample"> hrefとのリンク</a> <div id = "collapsexample"> <div>こんにちは、これはテストです! </div> </div>
さらに、以下に示すように、パネルグループと組み合わせて使用できます。
<! - パネルグループ - > <div id = "mypanel" role = "Tableist"> <! - > <div> <div role = "tab" "headingone"> <h4> <h4> <h4> <h4> <h4> <h4> <h4> <"collapse" data-parent = "#mypanel" href = " role = "tabpanel"> <div>こんにちは</div> </div> </div> <! - セカンドパネル - > </div>
家にクリックしてコンテンツパーツを制御することにより、コンテンツに対応するIDであるHREF = "#collapseone"を設定することです。
以前に使用したイベントと同様に、これらのコンポーネントは次のように同様の時間使用法を持っています
<script type = "text/javascript"> $( '#mypanel')
10。Carsouselスライディングコンポーネント
注:私たちが通常作るカルーセルなど、データライド= "Carousel"を使用します。まず、私が作成したカルーセル図コードを見てみましょう。
<div id = "mycontainer"> ---データターゲットのターゲット<div id = "carousel1" data-ride = "carousel"> <ol> - インジケーターはスライド表示を表します。 Data-slide-to = "1"> </li> <li data-target = "#carousel1" data-slide-to = "2"> </li> </ol> <! - rendering content-> <div role = "listbox"> <div> <p> Sunshine Mood、あなたと私はあなたと一緒に行きます</p> </div> </div> <div> <img src = "timg.jpg"> </div> <div> <img src = "xx.jpg"> </div> </div> < <span aria-hidden = "true"> </span> <span>前</span> </a> <a href = "#carousel1" bolte = "button" slide = "next"> <span aria-hidden = "true"> </span> next </span> </a> </div> </div>
効果は次のとおりです。
スライドの速度に関しては、Data-interval = "2000"を直接追加して2秒のスイッチトグルを設定できますが、この方法の問題は
ブラウザを更新するときは、切り替える前に左右のボタンを手動でクリックする必要があります。最良の方法は、JavaScriptに設定することです。次のコードに示されているように
<script type = "text/javascript"> $( "。Carousel")。Carousel({interval:2000;})</script>11。接辞コンポーネント
注:位置を使用:ポジショニングに固定し、Data-Spy = "Affix"をデータオフセットと組み合わせて監視を実現し、特定のイベントが発生したときにオフセットされます。次のコードをお読みください。
<div> <!-- Layout of the grid system --> <div> <ul> <li>11111111111</li> <li>222222222222</li> <li>33333333333333333</li> <li>44444444444444444444</li> <li> 5555555555 </li> <li> 666666666666666666 <li> 7777777777777777777777777777777777777777777777777777777777777777777777777777777777777777777777777777777777777777777777777777777777777777777777777 777777777777777777777777777777777777777777777777777777777777777777777777777777777777777777777777777777777777777 7777777777777777777777777777777777777777777777777777777777777777777777777777777777777777777777777777777777777777777777777777777 777777777777777777777777777777777777777777777777777777777777777777777777777777777777777777777777777777777777777 1111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111 11111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111 1111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111 11111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111 1111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111 11111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111 1111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111 11111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111 1111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111 11111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111 1111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111 11111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111 <p>1111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111 11111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111 11111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111 11111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111 1111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111 11111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111 1111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111 11111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111 1111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111 11111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111 1111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111 11111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111 1111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111 11111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111 1111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111 11111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111 1111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111 11111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111 1111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111 11111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111 1111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111 11111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111 1111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111 11111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111 1111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111 11111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111 1111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111 11111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111 1111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111 11111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111 1111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111 11111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111 <div> <ul> <li> 1111111111111 </li> <li> 2222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222233333333333333333333334444444444444444444444444444444444444444 < <li> 6666666666666 </li> <li> 77777777777777777777777777777777777777777777777777777777777777777777777777777777777777777777777777777777777777 77777777777777777777777777777777777777777777777777777777777777777777777777777777777777777777777777777777777777 77777777777777777777777777777777777777777777777777777777777777777777777777777777777777777777777777777777777777 77777777777777777777777777777777777777777777777777777777777777777777777777777777777777777777777777777777777777 src = "http://cdn.bootcss.com/jquery/1.11.3/jquery.min.js"> </scrip> <script src = "js/bootstrap.min.js"> </script> <script type = "text/javascript"> $( '。 }})$( '。JS-Affixed-Element-Bottom')。
JSコンポーネントはほぼここにあり、Bootstrapのフレームワークを学ぶことはほとんど終わりです。次の記事は終わりました。ブートストラップで特別にページを設計して作成し、共有する予定です。 Bootstrapフレームワークも学習している場合は、コミュニケーションと学習をご覧ください!
それでも詳細に勉強したい場合は、ここをクリックして3つのエキサイティングなトピックを勉強して添付できます。
ブートストラップ学習チュートリアル
ブートストラップ実用的なチュートリアル
ブートストラッププラグインの使用チュートリアル
上記はこの記事のすべての内容です。みんなの学習に役立つことを願っています。誰もがwulin.comをもっとサポートすることを願っています。