使用 Bootstrap 5，對我來說等寬的列顯示在彼此的下方。這是我的基本示例，直接取自 Bootstrap 網站：
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" integrity="sha384-1BmE4kWBq78iYhFldvKuhfTAU6auU8tT94WrHftjDbrCEXSU1oBoqyl2QvZ6jIW3" crossorigin="anonymous">
<div class="container">
<div class="row">
<div class="col">
Column
</div>
<div class="col">
Column
</div>
<div class="col">
Column
</div>
</div>
</div>Bootstrap (bootstrap.min.css) 加載在頭部，我可以使用所有引導類沒問題，但列顯示在彼此下方而不是彼此相鄰。當我指定col-xs-4所有列寬時，它作業正常：
<div class="container">
<div class="row">
<div class="col-xs-4">
Column
</div>
<div class="col-xs-4">
Column
</div>
<div class="col-xs-4">
Column
</div>
</div>
</div>
但是引導程式網站說我可以只使用col或col-(breakpoint)制作自動獲得相同寬度的列來填充行。這對我不起作用。上面的例子是這樣的：
第一個例子：
第二個例子：
注意：在col-(n)沒有斷點的col-4情況下使用（例如在這種情況下）即使應該也不起作用。
uj5u.com熱心網友回復：
嘗試洗掉本地檔案的鏈接，而是嘗試 CDN 鏈接。除了您遇到的問題之外，CDN 通常是您的網站速度和訪問您網站的任何人的瀏覽器快取的最佳實踐。
這是<head>您頁面的鏈接。
Bootstrap 5 捆綁包（捆綁包包括 Popper.js）
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js" integrity="sha384-MrcW6ZMFYlzcLA8Nl NtUVF0sA7MsXsP1UyJoMp4YLEuNSfAP JcXn/tWtIaxVXM" crossorigin="anonymous"></script>
這是 CSS 的鏈接。
<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC" crossorigin="anonymous">
PS：CDN 應該是您首選的原因是 - 想象一下有人訪問您的網站并且您的本地檔案加載到他們的瀏覽器中。然后他們訪問我的站點并且必須加載更多本地檔案。如果我們都使用 CDN，那么它已經從您的站點或我的站點加載到他們的瀏覽器中，哇，一切都變得更快了。
轉載請註明出處，本文鏈接：https://www.uj5u.com/shujuku/380545.html
標籤：html css 推特引导 bootstrap-5
上一篇：中等大小時如何在中間制作div