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">

2. Tambah satu baris

Di dalam bekas, anda perlu menambah satu baris. Ini akan menjadi bekas untuk lajur anda dan ia sepatutnya mempunyai kelas baris.

<div class="row">

3. Tambahkan lajur anda

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.

<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>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.

</div>
</div>

6. Nikmati reka letak anda!

Anda kini telah berjaya mencipta reka letak 5 lajur dalam Bootstrap. Anda kini boleh menggayakan lajur anda seperti yang dikehendaki.

Atas ialah kandungan terperinci Bagaimana untuk Mencipta Susun Atur 5 Lajur dalam Bootstrap 4?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!