在Bootstrap 中建立5 列佈局可能具有挑戰性,但透過一些簡單的操作就可以實現步驟。
第一步是為您的列建立一個容器。這將是所有列的父元素,並且它應該具有容器流體類別。
<div class="container-fluid">
在容器內,您將需要新增一行。這將是列的容器,它應該具有行類別。
<div class="row">
在行內,您將需要新增您的欄位。每個欄位都應該有 col 類,並且您想要的列數將取決於您嘗試建立的佈局。對於 5 列佈局,您需要新增 5 列。
<div class="col"></div> <div class="col"></div> <div class="col"></div> <div class="col"></div> <div class="col"></div>
新增列後,您可以在其中新增一些內容。這可以是文字、圖像或您想要的任何其他內容。
<div class="col"> <h1>Column 1</h1> <p>This is some content for column 1.</p> </div>
新增所有欄位後,您需要關閉行和容器標籤。
</div> </div>
您現在已經在 Bootstrap 中成功建立了 5 列佈局。現在您可以根據需要設定列的樣式。
以上是如何在 Bootstrap 4 中建立 5 列佈局?的詳細內容。更多資訊請關注PHP中文網其他相關文章!