Question

目前，我需要按照我老板的要求，在导航栏上悬挂徽标。他对它的外观感到满意，我也是如此，但我似乎无法弄清楚的是，当我在移动设备上调整浏览器或浏览网站时，徽标并没有调整大小，也会阻止下拉导航栏工作。

任何帮助都表示赞赏，伙计们。在问这里之前我尝试了一切。这是我在StackOverflow上的第一个问题。

提前谢谢。

＆＃13;

#logo {
  position: absolute;
}

@media (max-width:480px) {
  .navbar-brand {
    width: 80%;
    position: absolute;
  }
  .navbar-brand img {
    max-width: 100%;
    position: absolute;
  }
}

＆＃13;

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js"></script>
<link href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" rel="stylesheet"/>

<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
  <span class="sr-only">Toggle navigation</span>
  <span class="icon-bar"></span>
  <span class="icon-bar"></span>
  <span class="icon-bar"></span>
</button>
<a class="img-responsive navbar-brand hidden-xs" href="#" title="Barcelona 226 Center Exclusive - Official site">
  <img src="logo.png" class="hidden-xs" alt="Barcelona226">
</a>

＆＃13;

Bootstrap品牌标识 - 悬垂时调整大小

0 个答案: