Bagaimana untuk Mencipta Susun Atur 5 Lajur dalam Bootstrap 4?

Cara membuat Reka Letak Bootstrap 4, 5 Lajur

Membuat susun atur 5 lajur dalam Bootstrap boleh mencabar, tetapi ia boleh dilakukan dengan beberapa perkara mudah langkah.

1. Mulakan dengan bekas

Langkah pertama ialah mencipta bekas untuk lajur anda. Ini akan menjadi elemen induk untuk semua lajur anda dan ia sepatutnya mempunyai kelas cecair bekas.

<div class="container-fluid">
<h3 id="Tambah-satu-baris">2. Tambah satu baris</h3>
<p>Di dalam bekas, anda perlu menambah satu baris. Ini akan menjadi bekas untuk lajur anda dan ia sepatutnya mempunyai kelas baris.</p>
<pre class="brush:php;toolbar:false"><div class="row">
<h3 id="Tambahkan-lajur-anda">3. Tambahkan lajur anda</h3>
<p>Di dalam baris, anda perlu menambah lajur anda. Setiap lajur harus mempunyai kelas kol dan bilangan lajur yang anda inginkan bergantung pada reka letak yang anda cuba buat. Untuk reka letak 5 lajur, anda perlu menambah 5 lajur.</p>
<pre class="brush:php;toolbar:false"><div class="col"></div>
<div class="col"></div>
<div class="col"></div>
<div class="col"></div>
<div class="col"></div>

4. Tambahkan beberapa kandungan pada lajur anda

Setelah anda menambahkan lajur anda, anda boleh menambahkan beberapa kandungan pada lajur tersebut. Ini boleh berupa teks, imej atau apa sahaja yang anda mahukan.

<div class="col">
  <h1 id="Column">Column 1</h1>
  <p>This is some content for column 1.</p>
</div>

5. Tutup teg anda

Setelah anda menambahkan semua lajur anda, anda perlu menutup teg baris dan bekas.