我想在我共享的這個基本引導導航欄中將 li 專案“在所有頁面寬度上”居中。
我在父母中嘗試了“justify-content-center”。它使導航欄專案居中，但不是所有頁面寬度。專案應該在左邊一點點。
我檢查了太多問題，但無法弄清楚。我還添加了另一個示例來清潔外殼。
edit2：我想將這兩項與頁面中心對齊，但由于 flex 我不能。
所需的輸出：
結果：
uj5u.com熱心網友回復：
將text-center類添加到ul.
<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC" crossorigin="anonymous">
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js" integrity="sha384-MrcW6ZMFYlzcLA8Nl NtUVF0sA7MsXsP1UyJoMp4YLEuNSfAP JcXn/tWtIaxVXM" crossorigin="anonymous"></script>
<nav class="navbar navbar-expand-lg navbar-light bg-light">
<div class="container-fluid">
<a class="navbar-brand" href="#">Navbar</a>
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNavAltMarkup" aria-controls="navbarNavAltMarkup" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse w-100 justify-content-center me-4" id="navbarNavAltMarkup">
<div class="navbar-nav me-5">
<a class="nav-link active" aria-current="page" href="#">Home</a>
<a class="nav-link" href="#">Features</a>
<a class="nav-link" href="#">Pricing</a>
<a class="nav-link disabled">Disabled</a>
</div>
</div>
</div>
</nav>轉載請註明出處，本文鏈接：https://www.uj5u.com/yidong/438234.html
上一篇：div的背景顏色