負のマージンを持たずにブートストラップ列ガターを削除するにはどうすればよいですか?

負のマージンを使用せずにブートストラップで列の余白を削除する

問題:

列間のデフォルトの 30 ピクセルの間隔を削除する方法負の設定に頼らずにブートストラップでmargins?

解決策:

Bootstrap のバージョンに応じて、推奨されるアプローチは次のとおりです:

Bootstrap 5:

• 新規アプローチ: .g-0 クラスを利用して、.row 内のガターを削除します。
• 行ガッター: 特定のブレークポイント用に設計されたガター クラス (例: .gx) を適用することで応答性を向上させます。 -sm-4 小型横樋用

ブートストラップ 4:

• 簡略化: .no-gutters クラスを .row に直接実装します。 .
• コード例:

<div class="row no-gutters">
    <div class="col">x</div>
    <div class="col">x</div>
    <div class="col">x</div>
</div>

ブートストラップ 3.4.0 :

• クラスベース: 新しく追加された.row-no-gutters を導入しましたclass.

Bootstrap 3 ,

• パディング調整: 内のパディングを変更します。列を作成し、カスタム .no-gutter クラスを.row.
• CSS コード:

.no-gutter {
  margin-right: 0;
  margin-left: 0;
}

.no-gutter > [class*="col-"] {
  padding-right: 0;
  padding-left: 0;
}

以上が負のマージンを持たずにブートストラップ列ガターを削除するにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。