如何在 Bootstrap 4 中建立 5 列佈局？

如何建立Bootstrap 4、5 列佈局

在Bootstrap 中建立5 列佈局可能具有挑戰性，但透過一些簡單的操作就可以實現步驟。

1.從容器開始

第一步是為您的列建立一個容器。這將是所有列的父元素，並且它應該具有容器流體類別。

<div class="container-fluid">
<h3 id="新增一行">2.新增一行</h3>
<p>在容器內，您將需要新增一行。這將是列的容器，它應該具有行類別。 </p>
<pre class="brush:php;toolbar:false"><div class="row">
<h3 id="新增您的欄位">3.新增您的欄位</h3>
<p>在行內，您將需要新增您的欄位。每個欄位都應該有 col 類，並且您想要的列數將取決於您嘗試建立的佈局。對於 5 列佈局，您需要新增 5 列。 </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.在您的欄位中新增一些內容

新增列後，您可以在其中新增一些內容。這可以是文字、圖像或您想要的任何其他內容。

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

5.關閉標籤

新增所有欄位後，您需要關閉行和容器標籤。