我正在嘗試在 Bootstrap 5 中的列之間添加排水溝。我按照檔案說明了如何實作它,但由于某種原因,我無法在我的列之間添加排水溝。
我g-3用來在我的行中添加排水溝,根據檔案,這應該在我的行和列之間添加排水溝。我嘗試過使用gap-3,但隨后它將第 3 列移動到下一行。
我在這里想念什么?
<div class="container">
<div class="row row-cols-1 row-cols-sm-2 row-cols-lg-3 text-center g-3">
<div class="col-12">
<h1>Services</h1>
<p>Lorem ipsum, dolor sit amet consectetur adipisicing elit.</p>
</div>
<div class="col bg-white border rounded p-3">
<img class="rounded-circle" src="#" alt="#">
<h4>Title Here</h4>
<p>Some more info here</p>
</div>
<div class="col bg-white border rounded p-3">
<img src="#" alt="#">
<h4>Title Here</h4>
<p>Some more info here</p>
</div>
<div class="col bg-white border rounded p-3">
<img src="#" alt="#">
<h4>Title Here</h4>
<p>Some more info here</p>
</div>
<div class="col bg-white border rounded p-3">
<img src="#" alt="#">
<h4>Title Here</h4>
<p>Some more info here</p>
</div>
<div class="col bg-white border rounded p-3">
<img src="#" alt="#">
<h4>Title Here</h4>
<p>Some more info here</p>
</div>
<div class="col bg-white border rounded p-3">
<img src="#" alt="alt text">
<h4>Title Here</h4>
<p>Some more info here</p>
</div>
</div>
</div>
uj5u.com熱心網友回復:
所以這個問題是我必須在我的coldiv 中創建另一個 div,它應該有類bg-white border rounded p-3并且它不應該在coldiv 中。
檢查下面的代碼。
我換了這個
<div class="col bg-white border rounded p-3">
<img class="rounded-circle" src="#" alt="#">
<h4>Title Here</h4>
<p>Some more info here</p>
</div>
有了這個
<div class="col">
<div class="bg-white border p-3">
<img src="#" alt="alt text">
<h4>Title Here</h4>
<p>Some more info here</p>
</div>
</div>
uj5u.com熱心網友回復:
您的第一列占據了整行 - 所有 12 列。如果您將第一列更改為<div class=“col”>它是否提供您想要的?
轉載請註明出處,本文鏈接:https://www.uj5u.com/caozuo/429651.html
