我在 http://pawfamily.tk/~shivampaw/primahc.com/有一个测试站点
无论我做什么，徽标都不合适。我已经环顾四周很久了。尝试将填充更改为 0，将边距更改为 0，调整了它的大小，但随后它不适合我的 iPhone。
我希望徽标始终在左侧，显然我不希望它很小。我也希望它在移动设备的左侧。
我怎样才能实现这一目标？
这是我的导航栏代码：
<nav class="navbar navbar-default navbar-fixed-top">
<div class="container">
<a class="navbar-brand" href="#">
<img class="img-responsive" style="" src="images/logo.png" alt="Prima Healthcare">
</a>
<!-- Brand and toggle get grouped for better mobile display -->
<div class="navbar-header page-scroll">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
</div>
<!-- Collect the nav links, forms, and other content for toggling -->
<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
<ul class="nav navbar-nav navbar-right">
<li <?php echo $home; ?>>
<a href="index.php">Home</a>
</li>
<li <?php echo $b2b; ?>>
<a href="b2b.php">Business to Business</a>
</li>
<li <?php echo $contact; ?>>
<a href="contact.php">Contact</a>
</li>
</ul>
</div>
<!-- /.navbar-collapse -->
</div>
<!-- /.container-fluid -->
</nav>
谢谢！
似乎 .navbar-brand 属性不适用于超大图像。我设法通过简单地删除 .navbar-brand 属性并将 .pull-left 属性添加到图像以使显示与右侧的内容内联来实现目标，如下所示：
<a href="#">
<img class="img-responsive pull-left" src="images/logo.png" alt="Prima Healthcare">
</a>
如果您不打算使图像可点击，我什至会完全删除锚标签。
我会覆盖.navbar品牌。可以使用媒体查询为不同的屏幕大小定义不同的宽度值。
对于小屏幕，图像将为 200 像素，对于较大屏幕，图像将扩展到 250 像素。您可以更改数字。
.navbar-brand {
padding: 0;
}
.navbar-brand img {
width: 200px;
}
@media only screen and (min-width : 768px) {
.navbar-brand img {
width: 250px;
}
}
在这里小提琴：https://jsfiddle.net/DTcHh/16983/