BootstrapNavigation破壞網站寬度

導航正在改變網站寬度。我不知道這是為什么 我認為這是因為邊距或填充，但找不到任何解決問題的方法。我得出結論，這是堂兄問題，但我不知道為什么會這樣。請幫忙！

HTML代碼：

<div class="row">
        <div class="col-md-2"></div>
        <div class="col-md-8">
            <nav class="navbar navbar-expand-lg navbar-light bg-light">
                <a class="navbar-brand" href="#">IT SPECIALIST</a>
                <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#menu" aria-controls="menu" aria-expanded="false" aria-label="Toggle navigation">
                    <span class="navbar-toggler-icon"></span>
                </button>
                <div class="collapse navbar-collapse" id="menu">
                    <ul class="navbar-nav ms-auto">
                        <li class="nav-item active">
                            <a class="nav-link" id="active" href="#">G?óWNA</a>
                        </li>
                        <li class="nav-item dropdown">
                            <a class="nav-link dropdown-toggle" id="nav-link" href="#" id="navbarDropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                                O NAS
                            </a>
                            <div class="dropdown-menu" aria-labelledby="navbarDropdown">
                            <a class="dropdown-item" href="#">Zespó?</a>
                            <a class="dropdown-item" href="#">Partnerzy</a>
                            <a class="dropdown-item" href="#">Facebook Fanpage</a>
                            </div>
                        </li>
                        <li class="nav-item dropdown">
                            <a class="nav-link dropdown-toggle" id="nav-link" href="#" id="navbarDropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                                OFERTA
                            </a>
                            <div class="dropdown-menu" aria-labelledby="navbarDropdown">
                            <a class="dropdown-item" href="#">Odzyskiwanie Danych</a>
                            <a class="dropdown-item" href="#">Wsparcie dla twojej firmy</a>
                            </div>
                        </li>
                        <li class="nav-item">
                            <a class="nav-link" id="nav-link" href="#">US?UGI DLA FIRM I OSóB PRYWATNYCH</a>
                        </li>
                        <li class="nav-item">
                            <a class="nav-link" id="nav-link" href="#">DLACZEGO MY</a>
                        </li>
                        <li class="nav-item">
                            <a class="nav-link" id="nav-link" href="#">ZG?O? AWARI?</a>
                        </li>
                    </ul>
                </div>
            </nav>
        </div>
        <div class="col-md-2"></div>
    </div>

我洗掉了整個 css 代碼，沒有任何改變，但如果你需要它，它是：

CSS代碼：

body {
  margin: none;
  padding: none;
}

.navbar .navbar-brand {
  margin-left: 1vw;
}

.navbar button {
  margin-right: 1vw;
}

.navbar .dropdown-item:hover, .navbar #nav-link:hover, .navbar #active {
  background-color: #5394dd;
  color: white;
}

.navbar .nav-item {
  margin-left: 0.5vw;
}

.navbar .nav-item:last-child {
  margin-right: 1vw;
}

編輯 1： row問題是，在使用導航時，沒有任何行和列，導航占用整個站點的寬度，僅此而已。那么，有沒有其他方法可以像這樣使站點居中？

uj5u.com熱心網友回復：

col從導航欄周圍洗掉所有's 并添加一個container。

<div class="container">
   <nav class="navbar navbar-expand-lg navbar-light bg-light">
       <!--Your nav content here-->
   </nav>
</div>

uj5u.com熱心網友回復：

我不確定它究竟是如何破壞網站的寬度的，但嘗試將其添加到您的樣式中：

*{
margin: 0;
padding: 0;
}

標籤：html css bootstrap-4 蠢货

上一篇：我下載了bootstrap5和jquery3.6，問題是當我嵌入它們時，下拉按鈕不起作用我的代碼中是否缺少任何內容？

下一篇：如何使用重繪（F5）更新api背景圖片？