我有這個液體容器，它是這樣劃分的
<div class="container-fluid">
<div class="row">
<div class="col-3">
sidebar
</div>
<div class="col-7">
top slider
</div>
<div class="col-2">
big button
</div>
</div>
</div>
我想要的下一部分是讓 4 個 div 占據正下方的區域 col-7 col-2
基本上我想要這樣的東西 
我曾嘗試在現有行下方創建另一行并有一個空白的 col-3，但我想要的四列沒有就位。我怎么能有下面的四列？
uj5u.com熱心網友回復：
這是我最好的鏡頭。但是row右邊是一個新的row所以它也有12 column。
div {border: solid coral;}<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC" crossorigin="anonymous">
<section class="container">
<section class="row text-center">
<div class="col-3">
Col-3
</div>
<section class="col">
<section class="row row-cols-4">
<div class="col-8">Col-8</div>
<div class="col-4">Col-4</div>
<div class="col">Col</div>
<div class="col">Col</div>
<div class="col">Col</div>
<div class="col">Col</div>
<div class="col">Col</div>
<div class="col">Col</div>
<div class="col">Col</div>
<div class="col">Col</div>
</section>
</section>
</section>
</section>轉載請註明出處，本文鏈接：https://www.uj5u.com/qiye/367928.html
標籤：html css 推特引导 bootstrap-5
上一篇：移動螢屏尺寸上的文本轉義div