在引导程序导航栏上插入图像

我正在尝试在导航栏上设置图像，但我无法正确放置它。

这是 html：

 <nav class="navbar navbar-inverse navbar-fixed-top  ">
  <div class="navbar-header">
    <a class="navbar-brand" href="#">
      <img width="130px" height="70px"src="{% static "series/images/logo.png"%}">
    </a>
    <a class="navbar-brand" href="{% url 'series:index'%}">
      <span class="glyphicon glyphicon-home"></span> | MEGA SERIES  </a>
  </div>
  <ul class="nav navbar-nav">
    <li class="active"><a href="{% url 'series:index'%}">Series</a></li>
  </ul>
</nav>

这是图像显示的方式：

我能做什么？

谢谢。

原文由 Lechucico 发布，翻译遵循 CC BY-SA 4.0 许可协议

阅读 368

你可以这样做——

工作示例

  .navbar-inverse .navbar-brand {
  display: flex;
  align-items: center;
  padding: 5px;
}
.navbar-brand img {
  height: 100%;
  margin-right: 20px;
}

 <html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
 <link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">
          <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
          <script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
           <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
           <style type="text/css">

           </style>
           </head>
           <body>
            <nav class="navbar navbar-inverse navbar-fixed-top  ">
  <div class="navbar-header">
    <a class="navbar-brand" href="#">
      <img classs="img-responsive" width="130px" height="" src="https://cdn.pixabay.com/photo/2016/02/19/15/46/dog-1210559_960_720.jpg">
    </a>
    <a class="navbar-brand" href="">
      <span class="glyphicon glyphicon-home"></span> | MEGA SERIES  </a>
  </div>
  <ul class="nav navbar-nav">
    <li class="active"><a href="">Series</a></li>
  </ul>
</nav>
  </body>
  </html>

原文由 neophyte 发布，翻译遵循 CC BY-SA 3.0 许可协议

在引导程序导航栏上插入图像

你尚未登录，登录后可以

CSS如何让指定的某个Tag不显示（比如：display=none），但是还是占有位置呢？

如何实现类似豆包的AI改写框跟随内容滚动效果？

body :first-child(不是body:first-child，中间有空格)伪类选择器到底选中了什么元素？

问一个鼠标滚动事件，这种是怎么实现的？

如何在CSS中实现滚动条不溢出圆角框？

form对象根据表单dom元素的name属性获取元素对象是基于什么标准的？兼容性如何？

请问，是否可以设定Table的宽度，或者不让其超过父容器呢？

Stack Overflow 翻译