[英]Bootstrap navbar spacing issue
請在我的網站上查看主頁 。 導航欄的間距到處都是。 我不確定我的代碼在哪里出問題。
我已鏈接到引導CDN,並且沒有鏈接到我自己的自定義CSS文件。
我試圖更改崇高文字3中的設置,以將縮進更改為使用縮進而不是空格。
我也重新編寫了代碼。 似乎唯一起作用的是如果我不將導航欄的任何元素放在新行上。 無線滴; 僅連續編碼,沒有空格。
任何幫助深表感謝。
謝謝。
我的HTML:
<div class="navbar navbar-inverse navbar-static-top">
<div class="container">
<a href="/" class="navbar-brand">Kellumonline</a>
<button class="navbar-toggle" data-toggle="collapse" data-target=".navHeaderCollapse">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<div class="collapse navbar-collapse navHeaderCollapse">
<ul class="nav navbar-nav navbar-right">
<li class="active"><a href="/">Home</li>
<li><a href="tech/">Tech</li>
<li class="dropdown">
<a class="dropdown-toggle" data-toggle="dropdown" href="gaming/">Gaming <i class="caret"></i></a>
<ul class="dropdown-menu">
<li><a href="#">AGGINAYR</li>
<li><a href="#">XB1</li>
<li><a href="#">PS4</li>
<li><a href="#">ANDROID</li>
</ul>
</li>
<li><a href="skate/">Skate</a></li>
<li><a href="contact/">Contact</a></li>
</ul>
</div>
</div>
</div>
您的問題是您沒有關閉列表組中的標簽。 查看您的html,您將看到以下內容:
<ul class="nav navbar-nav navbar-right">
<li class="active"><a href="/">Home</li>
<li><a href="tech/">Tech</li>
<li class="dropdown">
<a class="dropdown-toggle" data-toggle="dropdown" href="gaming/">Gaming <i class="caret"></i></a>
<ul class="dropdown-menu">
<li><a href="#">AGGINAYR</li>
<li><a href="#">XB1</li>
<li><a href="#">PS4</li>
<li><a href="#">ANDROID</li>
</ul>
</li>
<li><a href="skate/">Skate</a></li>
<li><a href="contact/">Contact</a></li>
</ul>
您的HTML如下所示:
<li class="active"><a href="/">Home</li>
你應該有:
//added closing tag for a: </a>
<li class="active"><a href="/">Home</a></li>
使用標題代碼:
<div class="navbar navbar-inverse navbar-static-top">
<div class="container">
<a href="/" class="navbar-brand">Kellumonline</a>
<button class="navbar-toggle" data-toggle="collapse" data-target=".navHeaderCollapse">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<div class="collapse navbar-collapse navHeaderCollapse">
<ul class="nav navbar-nav navbar-right">
<li class="active"><a href="/">Home</a></li>
<li><a href="tech/">Tech</a></li>
<li class="dropdown">
<a class="dropdown-toggle" data-toggle="dropdown" href="gaming/">Gaming <i class="caret"></i></a>
<ul class="dropdown-menu">
<li><a href="#">AGGINAYR</a></li>
<li><a href="#">XB1</a></li>
<li><a href="#">PS4</a></li>
<li><a href="#">ANDROID</a></li>
</ul>
</li>
<li><a href="skate/">Skate</a></li>
<li><a href="contact/">Contact</a></li>
</ul>
</div>
</div>
</div>
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.