ブートストラップ モーダル (モーダル ボックス) は、カスタム Jquery プラグインを使用して作成されます。
モーダル ウィンドウを作成してユーザー エクスペリエンスを強化したり、実用的な機能をユーザーに追加したりするために使用できます。ポップオーバーとツールチップをモーダルで使用できます。 (推奨学習: Bootstrap ビデオ チュートリアル )
では、いくつかの例と説明を通じて、Bootstrap を使用してモーダル ウィンドウを作成する方法について説明します。カスタマイズに利用できるさまざまなオプションについても説明します。
Jquery、Bootstrap CSS、および JavaScript ファイル bootstrap-modal.js が必要です。この js ファイルは、作成した Bootstrap ダウンロードのメイン フォルダー内の js フォルダーにあります。
Jquery は、Bootstrap ホーム フォルダーの docs >assets > js にあり、jquery.js という名前です。または、https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js に直接アクセスして Jquery をダウンロードすることもできます。
ブートストラップ モーダル (モーダル ボックス) はどのようなものですか
#次の例は、ブートストラップ モーダル (モーダル ボックス) がどのようなものかを示しています。
Web サイトでブートストラップ モーダル (モーダル ボックス) を使用する
次の例は、Web ページでブートストラップ モーダル (モーダル ボックス) を使用する方法を示しています。モーダル。 JavaScript コードを記述する必要はないことに注意してください。
<div> <h2>使用Bootstrap创建模态框</h2> <div> <div> <a>×</a> <h3>这是一个模态框标题</h3> </div> <div> <h4>模态框中的文本</h4> <p>你可以在这添加一些文本。</p> </div> <div> <a>唤醒活动</a> <a>关闭</a> </div> </div> <p><a>发动演示模态框</a></p> </div> <script></script> <script></script>
Bootstrap に関連する技術的な記事については、Bootstrap チュートリアル 列にアクセスして学習してください。
以上がブートストラップ モーダル ボックスの用途は何ですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。