「Bootstrap4入門」ネスティングボタングループを表示するサンプル
書式
class=”btn btn-primary dropdown-toggle” data-toggle=”dropdown”
使用例
「Bootstrap4入門」ラジオボタンを使用するサンプル
書式
class=”btn-group btn-group-toggle” data-toggle=”buttons”
使用例
<div class="b ...「Bootstrap4入門」.dropdown-toggle-splitでスプリットボタンを表示するサンプル
書式
“btn btn-primary dropdown-toggle dropdown-toggle-split” data-toggle=”dropdown”
.dr ...
「Bootstrap 4入門」.bg-*でプログレスの色を指定するサンプル
説明
.bg-* や CSS の background-colorで色を指定
使用例
「Bootstrap 4入門」ボタンの様式と種類を指定する方法
書式
.btn-* でボタンの種類を指定
.btn はボタンを表示
使用例
「Bootstrap 4入門」.progress-bar-stripedでストライプのプログレスを指定する方法
説明
.progress-bar-striped:ストライプ
使用例
「Bootstrap 4入門」.active で現在のページのアクティブ状態を有効にする
書式
アクティブ 現在のページには .active をつけます
使用例
「Bootstrap4入門」縦並びボタングループとドロップダウンメニューのサンプル
書式
btn-group-vertical 縦並びボタングループ
data-toggle=”dropdown” ドロップダウンメニュー
使用例
「Bootstrap 4入門」.badge-pillで角の丸いバッジを表示するサンプル
説明
.badge-pill 角の丸いバッジを表示
使用例
「Bootstrap 4入門」.badge-*でリンクバッジを設定するサンプル
書式
.badge-* を <a> 要素に対して使用し、クリック可能なバッチとなり、マウスを乗せる際の色変わります。
使用例
「Bootstrap4」メニューナビ(.nav)を使うサンプル
使用方法
<ul class=”nav”>
<li class=”nav-item”>
サンプルコード
「Bootstrap 4入門」.badge-*でバッジを表示するサンプル
書式
.badge, .badge-*:バッジを表示
使用例
「Bootstrap 4入門」progress-barとbg-*で複数のプログレスバーを表示するサンプル
説明
progress-bar bg-success 複数バー
使用例
「Bootstrap 4入門」.pagination, .page-itemでページネーションを表示する
説明
.pagination, .page-item, .page-link:ページネーションを表示
使用例
「Bootstrap 4入門」インプットグループのサンプル
書式
<input>, <select>, <textarea> でインプットグループを使用
使用例
「Bootstrap4入門」ボタンタグを使うサンプル
説明
.btn は <button>, <input>, <a> タグに使用します。
使用例
「Bootstrap4入門」アウトラインoutlineボタンを設定するサンプル
説明
.btn-outline-* :アウトラインボタンを表示します。
使用例
「Bootstrap4入門」.btn-lg, .btn-sm でボタンの大きさを指定するサンプル
説明
.btn-lg:ボタンの大
.btn-sm:ボタンの小
使用例