twitter-bootstrap - Bootstrap で 1200px ではなく幅 960px のコンテナを選択する方法

Question

Bootstrap で 1200px ではなく幅960pxのコンテナを選択するにはどうすればよいですか?

Answer 1

Bootstrap は、1200px を超える幅の画面でコンテナーの幅を 1170px に設定します。
992px から 1200px の画面の場合、コンテナの幅は 970px に設定されます。ブートストラップのグリッドの詳細については、こちら
を参照 してください。大画面用にコンテナを 760 ピクセルに設定する場合は、これを見つけて bootstrap.css で編集するか、次のコードをカスタム CSS に追加する必要があります。

@media (min-width: 1200px) {
  .container {
    width: 960px;
   }
}

と

@media (min-width: 992px) {
  .container {
    width: 960px;
   }
 }

お役に立てれば

Answer 2

これは私にとってはうまくいきます。

!important の使用はお勧めしません。しかし、あなたは試すことができます。

.container, .container-fluid{
 幅: 960px !重要;
}

Answer 3

sass とブートストラップ v3.3.1 を使用している場合は、ブートストラップをインポートする前にこれらの変数を定義するだけです。

$grid-gutter-width: 20px;
$container-large-desktop: 940px + $grid-gutter-width;

詳細については、変数のソース ファイルを確認してください: https://github.com/twbs/bootstrap-sass/blob/master/assets/stylesheets/bootstrap/_variables.scss

Answer 4

Bootstrap3 の場合、デフォルトで 960px になるようにカスタマイズできます ( http://getbootstrap.com/customize/ ) 。

1. @container-lg を ((1140px + @grid-gutter-width)) から ((940px + @grid-gutter-width)) に変更します。
2. @grid-gutter-width を 30px から 20px に変更します。

次に、ブートストラップのカスタム バージョンをダウンロードして使用します。現在、デフォルトで 960px になっているはずです。