2016.12.06  2019.06.20

Bootstrap3のレスポンシブを無効にしてグリッドだけを使う

Web制作


Bootstrapのグリッドレイアウトを使用したいが、レスポンシブは必要ない時の方法をご紹介します。

公式ドキュメント(英語)
http://getbootstrap.com/getting-started/#disable-responsive
作成例(使用されているnon-responsive.cssも参考にして下さい)
http://getbootstrap.com/examples/non-responsive/

1.meta要素のviewportを削除します。

2.containerクラスを上書きします。固定したい幅に設定してください。

3.navbarを使っているときは崩れるのを避けるため以下のように上書きします。

4.col-xs-*を使用してグリッドレイアウトを構築します。


  1. この記事へのコメントはありません。

  1. この記事へのトラックバックはありません。