ブートストラップ-レスポンシブデモ
Bootstrapは、モバイルフレンドリーな開発を高速化するために、いくつかのヘルパークラスを提供します。これらは、大、小、中のデバイスと組み合わせて、メディアクエリを介してデバイスごとにコンテンツを表示および非表示にするために使用できます。
これらは慎重に使用し、同じサイトのまったく異なるバージョンを作成しないようにしてください。 Responsive utilities are currently only available for block and table toggling。
クラス | デバイス |
---|---|
.visible-xs | 非常に小さい(768px未満)が表示されます |
.visible-sm | 小さい(最大768ピクセル)表示 |
.visible-md | 中(768ピクセルから991ピクセル)が表示されます |
.visible-lg | 大きい(992ピクセル以上)表示 |
.hidden-xs | 極小(768px未満)非表示 |
.hidden-sm | 小さい(最大768ピクセル)非表示 |
.hidden-md | 中(768ピクセルから991ピクセル)非表示 |
.hidden-lg | 大きい(992ピクセル以上)非表示 |
例 | 説明 | ダウンロードリンク |
---|---|---|
カードレスポンシブ | この例は、ブートストラップのカード構造について示しています | ダウンロード |
簡単な紹介文 | この例は、Bootstrapのお客様の声の構造について示しています | ダウンロード |
ビデオグリッド | この例は、ブートストラップのグリッドビデオ構造について示しています | ダウンロード |
バナー画像 | この例は、Bootstrapのバナー画像構造について示しています | ダウンロード |
フェイスインジケーター付きカルーセル | この例は、Bootstrapの顔インジケーター構造を持つカルーセルについて示しています | ダウンロード |