我正在尝试将导航中的图像更改为更大的尺寸。
然而,通过这样做,导航栏的格式不正确。
我在这里有代码:http://www.bootply.com/941lMP3fj6#
问题可能是图像位于锚标记中。但不确定。
答案 0 :(得分:13)
答案 1 :(得分:4)
将此添加到您的样式中:
.navbar-brand
{
margin: 0;
padding: 0;
{
.navbar-brand img
{
max-height: 100%;
}
答案 2 :(得分:2)
您需要调整导航栏的高度。
您可以在LESS中使用此变量来调整高度,它会垂直居中导航栏并包含所有必要的填充:
@navbar-height
50px是默认值。
如何在常规CSS中进行调整,更改min-height
的{{1}}和.navbar
的高度,然后调整navbar-fixed-top
的填充。
这是顶部应该如何构建(缺少navbar-header):
.navbar-nav
示例Bootply:http://www.bootply.com/tOoeM8o8Om
答案 3 :(得分:1)
<div class="container">
<button class="navbar-toggle" data-target=".navbar-responsive-collapse" data-toggle="collapse" type="button">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<div class="navbar navbar-collapse collapse navbar-responsive-collapse">
<div class="pull-left" style="margin-right: 15px;">
<a rel="home" href="/" title="www.site.nl">
<img src="//placehold.it/200x51">
</a>
</div>
<ul class="nav navbar-nav">
<li class="active"><a href="">Home</a></li>
<li><a href="">About</a></li>
<li><a href="">Link 1</a></li>
<li><a href="">Link 2</a></li>
</ul> <!-- end nav-->
<ul class="nav navbar-nav pull-right">
<li class="dropdown">
<a href="" class="dropdown-toggle" data-toggle="dropdown"><strong class="caret"></strong> Select language</a>
<ul class="dropdown-menu dropdown-menu-right">
<li><a href="">NL</a></li>
<li><a href="">IL</a></li>
<li><a href="">ENG</a></li>
</ul>
</li>
</ul> <!-- end nav menu right -->
</div> <!-- end nav-collapse -->
</div>
将您的徽标放在容器内。
以上代码有效!!
检查并告诉我您是否有任何问题!!