前言 - 我不是在問“navbar-fixed-top”
我正在嘗試使用自定義高度制作簡單的導航欄。
HTML 代碼：
<nav class="navbar navbar-expand-md">
<div class="container-fluid nav-bar">
<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">H</span>
</button>
<div class="collapse navbar-collapse" id="navbarNavAltMarkup">
<div class="navbar-nav ms-auto">
<a class="nav-link" href="#">HOME</a>
<a class="nav-link" href="#">DESTINATIONS</a>
<a class="nav-link" href="#">CREW</a>
<a class="nav-link" href="#">TECHNOLOGIES</a>
</div>
</div>
</div>
</nav>
CSS 代碼：
.navbar {
background-color: orange;
height: 72px !important;
}
a {
color: #000;
}
這是 Codeply 鏈接：https ://www.codeply.com/p/mBsxyw02Q3
打開溢位選單（或 Bootstrap 語言中的切換器）時，“導航品牌”以及導航欄中的其他元素會向上移動以顯示隱藏的元素。
關于我的一些事情——我剛開始 Web Dev，所以我只知道一些關于 HTML 和 CSS 的事情。我知道這里的問題可能是由于腳本而發生的，但我不確定。所以讓我知道這個問題是否可以用 CSS 以及如何糾正。如果不是，它與javascript有關嗎？
當我打開漢堡選單時，我已經檢查了頁面的填充或邊距是否有任何變化，但是沒有任何變化，所以我有點不知道這里可能發生了什么。
uj5u.com熱心網友回復：
您需要添加幾行代碼來解決此問題。
.navigation {
background-color: orange;
min-height: 72px !important;
}
.navbar-brand {
min-height: 55px;
line-height: 48px;;
}
轉載請註明出處，本文鏈接：https://www.uj5u.com/houduan/407517.html
標籤：
下一篇：從引導程式5按鈕復制樣式到標簽