0

私はBootstrapが大好きです。それは素晴らしいですが.span3、現在の幅が好きなときに、クラス要素をどんどん近づけようとします。.span3クラスを使用する要素を調整する必要があるまで、ブートストラップにリラックスするように指示するにはどうすればよいですか? 画面サイズが幅 1170 ピクセル以上の場合、すべてが適切に配置されているとしましょう。ただし、幅が 980 ピクセル程度になると、Bootstrap はすべてを少し近づけますが、必要はありません。画面サイズが 767px 程度になるまで、Bootstrap に調整を落ち着かせるにはどうすればよいでしょうか。

素晴らしい天才のために、 JSFiddleも作成しました。

私が知る限り、次のようなメディア クエリが最適な呼び出しです。

@media (min-width: 768px){
    .span3: chill out;
}
@media (max-width: 767px){
    .span3: do yo thang;
}
4

1 に答える 1

0

これは、Bootstrapの応答性の一部です。通常のサイズでは、グリッド列間のガターは20ピクセルですが、画面幅が大きい場合（1200ピクセル以上）は、ガターが30ピクセルに緩みます。

1）LESSファイルを手動で編集している場合

この行については、「variables.less」を調べてください。

@gridGutterWidth768:      20px;

30pxに変更します。LESSを再コンパイルします。

2）オーバーライドCSSファイルを作成している場合

これをカスタムCSSファイルに含め、ブートストラップ後に含まれる/インポートされることを確認します。

@media (min-width: 768px) and (max-width: 979px) {
  .row {
    margin-left: -30px;
  }
  [class*="span"] {
    margin-left: 30px;
  }
}
于 2013-03-09T01:09:44.960 に答える