Bootstrap 表示/非表示



設定値

Extra small devices
スマートフォン (<768px)
Small devices
タブレット (≥768px)
Medium devices
デスクトップPC (≥992px)
Large devices
デスクトップPC (≥1200px)
.visible-xs-* Visible
.visible-sm-* Visible
.visible-md-* Visible
.visible-lg-* Visible
.hidden-xs Visible Visible Visible
.hidden-sm Visible Visible Visible
.hidden-md Visible Visible Visible
.hidden-lg Visible Visible Visible
ノーマル表示(Bootstrap利用無し)

 

<div class=”mydiv”> </div>

スマホ時のみ表示

visible-xs-block
visible-xs-inline
visible-xs-inline-block

※↑画面サイズによってはココに<div>が表示される。
<div class="visible-xs-block">visible-xs-block</div>
<div class="visible-xs-inline">visible-xs-inline</div>
<div class="visible-xs-inline-block">visible-xs-inline-block</div>

スマホ時のみ非表示

※↑画面サイズによってはココに<div>が表示される。
<div class="hidden-xs">hidden-xs</div>

1週間でできる会員サイト「Limited」

1週間でできる会員サイト「Limited」
必要最小限。だから分かりやすい。始めやすい。続けやすい。
限定① 安⼼・安全の会員制
限定② 必要最⼩限の機能
限定③ 独⾃機能を追加可能

前の記事

Bootstrap 画像