「Bootstrap4」テーブル(.table)のクラスを使うサンプル
書式
table class=”table”
使用例
「Bootstrap 4入門」カルーセル(carousel)のサンプル
説明
.carousel-indicators インジケータを表示
.carousel-control-{prev|next}, .carousel-control-{prev|next}-icon
左右の矢印 ...
「Bootstrap4入門」.card-header-tabsでビゲーションタブを実装するサンプル
使用例
<head> <title>Bootstrap 实例</title> <meta charset="utf-8"> <meta name="viewport" con ...「Bootstrap4入門」.collapseで折りたたみを実装する
使用例
<div class="container"> <h2>折りたたみのサンプル</h2> <p>2hhhhh</p> <button type="butto ...「Bootstrap 4入門」チェックボックスとラジオボタンのサンプル
書式
.input-group-text 前方・後方部品にテキストを用いる
使用例
「Bootstrap 4入門」input-group-sm，input-group-lgでサイズ変更する
書式
.input-group-sm 小さいインプットグループ
.input-group-lg 大きなインプットグループ
使用例
「Bootstrap 4入門」input-groupでインプットグループを表示する方法
書式
.input-group インプットグループを構成
.input-group-prepend 前方部品
.input-group-append 後方部品
使用例
「Bootstrap 4入門」モーダルダイアログを使うサンプル
書式
.modal, .modal-dialog：モーダルダイアログ構成
.modal-content コンテンツ
.modal-header ヘッダ
.modal-body ボディ
.mod ...
「Bootstrap4」col-{breakpoint}-{n} でスマートフォン画面を等分にする
構文
<div class=”row”>
<div class=”col-sm-3″ >xxx</div>
</div& ...
「Bootstrap4入門」等幅グリッドを使うサンプル
構文
<div class=”row”>
<div class=”col”>xxx</div>
</div> ...
「Bootstrap4入門」幅グリッドを設定するサンプル
使用例1
列の幅とさまざまなデバイスでの表示方法を制御します