Bagaimana untuk Menambah Margin/Padding Antara Lajur Bootstrap Tanpa Memecah Susun Atur?

Bagaimana untuk Menambah Ruang Margin/Padding Antara Lajur dalam Bootstrap?

Apabila mereka bentuk tapak web menggunakan Bootstrap, adalah perkara biasa untuk perlu menambah margin tambahan atau ruang padding antara lajur . Semasa cuba mencapai matlamat ini, sesetengah pengguna telah menemui hasil yang tidak memuaskan.

Satu kaedah popular ialah mengubah suai kelas lajur kepada col-md-5 dengan tarik-kiri atau tarik-kanan. Walau bagaimanapun, pendekatan ini boleh mewujudkan jurang yang terlalu besar.

Penyelesaian yang lebih berkesan ialah meletakkan div dalam kelas col-md-6 asal. Div ini kemudiannya boleh digayakan dengan margin dan padding yang diingini.

Berikut ialah contoh:

<code class="html"><div class="row">
    <div class="text-center col-md-6">
        <div class="classWithPad">Widget 1</div>
    </div>
    <div class="text-center col-md-6">
        <div class="classWithPad">Widget 2</div>
    </div>
</div></code>

<code class="css">.classWithPad {
    margin: 10px;
    padding: 10px;
}</code>

Dengan menggunakan kaedah ini, anda boleh menambah margin dan ruang padding yang dikehendaki dengan mudah antara lajur tanpa menjejaskan reka letak lajur. Teknik ini memberikan fleksibiliti dan membolehkan kawalan tepat ke atas jarak antara elemen.

Atas ialah kandungan terperinci Bagaimana untuk Menambah Margin/Padding Antara Lajur Bootstrap Tanpa Memecah Susun Atur?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!