Bagaimana untuk Membuat Bootstrap 3 Lajur Span Berbilang Baris?

Menjangkau Lajur Bootstrap Merentas Berbilang Baris

Membuat reka letak grid dengan Bootstrap boleh menjadi tugas yang mudah. Walau bagaimanapun, apabila berhadapan dengan cabaran untuk mempunyai lajur menjangkau berbilang baris, ia boleh menjadi agak membingungkan. Panduan ini akan menunjukkan cara untuk mencapai ini menggunakan Bootstrap 3.

Penyelesaian untuk Bootstrap 3:

Untuk mencipta lajur yang merentangi dua baris dalam Bootstrap 3, ikut ini langkah:

<div class="row">
  <div class="col-md-4">
    <div class="well">
      1
      <br>
      <br>
      <br>
      <br>
      <br>
    </div>
  </div>
  <div class="col-md-8">
    <div class="row">
      <div class="col-md-6">
        <div class="well">
          2
        </div>
      </div>
      <div class="col-md-6">
        <div class="well">
          3
        </div>
      </div>
    </div>
    <div class="row">
      <div class="col-md-6">
        <div class="well">
          4
        </div>
      </div>
      <div class="col-md-6">
        <div class="well">
          5
        </div>
      </div>
    </div>
  </div>
</div>

Penjelasan:

Dalam kod HTML ini, kami mencipta grid dua baris. Baris pertama mengandungi satu lajur yang merangkumi empat unit, manakala baris kedua mengandungi dua lajur setiap satu merangkumi dua unit. Lajur dalam baris pertama merangkumi dua baris kerana ia tidak terkandung dalam struktur baris bersarang.

Atas ialah kandungan terperinci Bagaimana untuk Membuat Bootstrap 3 Lajur Span Berbilang Baris?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!