在Bootstrap v3.3.7 (http://getbootstrap.com)中,在導航條內設置LOGO html
<nav class="navbar navbar-default navbar-fixed-top"> <div class="container"> <div class="navbar-header"> <a class="navbar-brand" href="#" > <img src="img/logo.png" alt="茶語"/> </a> <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#navbar-collapse"> <span class="icon-bar"></span> <span class="icon-bar"></span> <span class="icon-bar"></span> </button> </div> <div class="collapse navbar-collapse" id="navbar-collapse"> <ul class="nav navbar-nav navbar-right"> <li class="active"> <a href="#"> <span class="glyphicon glyphicon-home"></span>主頁 </a> </li> <li><a href="#">HTML</a></li> <li><a href="#">CSS</a></li> <li><a href="#">JavaScript</a></li> <li><a href="#">jQuery</a></li> <li><a href="#">BootStrap</a></li> <li><a href="#">工具</a></li> <li><a href="#">問題記錄</a></li> </ul> </div> </div> </nav>
結果LOGO沒有居中bootstrap
更改a的內外邊距樣式能夠解決這個問題工具
<a class="navbar-brand" href="#" style="margin: 0 0;padding: 0 0;"> <img src="img/logo.png" alt="茶語"/> </a>