モーダルウインドウ作成

モーダルウインドウ作成
モーダルウインドウは、ユーザになんらかの操作を
促すウインドウ
必要なのは呼び出すボタンと
ウインドウ
まずはボタンを a要素で作成
,a href=”#myModal” class=”btn” data-toggle=”modal”>Modal window</a>
これで
class=”btn” によりリンクがボタンの形になる
そして、次にウインドウの作成
これは
<div id=”myModal” class=”modal h8ide fade”>
</div>
としてウインドウをつくる
そして、スマホページのように
ヘッダー
ボディ
フッターを作成する
ヘッダーは
<div class=”modal-header”>
</div>
ボディは
<div class=”modal-body”>
</div>
フッターは
<div class=”modal-fotter”>
</div>
で作成
それぞれに記述していく
ヘッダーには閉じるボタンをつけたいので
<div class=”modal-header”>
<a href=”#” class=”close” data-dismiss=”modal”>×</a>
</div>
とする

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です