ブートストラップ行の g-5 を超える列間隔のネイティブ CSS スタイルをカスタマイズする方法

Question

ブートストラップを使用して簡単なランディング ページを構築しています。行の列間隔を広げる必要があります。カスタム Sass Spacing Mixin を使用して間隔を増やすことができることはわかっていますが、構築している Web サイトにはいくつかのセクションが含まれているため、シンプルに保ち、ビルド プロセスを必要としないようにしたいと考えています。行には g-5 クラス名を使用し、列間に 32 ピクセルまたは 40 ピクセルの間隔を確保しました。 CSSを使ってさらに増やす方法。

<div class="container mt-5 pt-5">
      <div class="行 text-light g-5 fs-1">
        <div class="col-lg-4">
          <div class="bg-dark p-5">列</div>
        </div>
        <div class="col-lg-4">
          <div class="bg-dark p-5">列</div>
        </div>
        <div class="col-lg-4">
          <div class="bg-dark p-5">列</div>
        </div>
      </div>
    </div>

Answer 1

CSS を使用して行内の列間隔を広げるには、grid-column-gap プロパティを使用できます。このプロパティは、グリッド レイアウトの列間の間隔を指定します。

リーリー リーリー