css - 在 Bulma 导航栏中调整品牌徽标的大小（Angular 7）

Question

如果没有图像，我目前无法在我的 Bulma CSS 导航栏中调整品牌徽标图像的大小。根据文档在图像上设置内联宽度和高度会拉伸图像。如何在不失真的情况下调整图像大小？

navbar.component.html

<nav class="navbar" role="navigation" aria-label="main navigation">
  <div class="navbar-brand">
    <a class="navbar-item" href="#">
        <img src="../assets/images/my-image.png" width="112" height="28"/>
      Brand Name
    </a>
    <a role="button" class="navbar-burger burger" aria-label="menu" aria-expanded="false">
      <span aria-hidden="true"></span>
      <span aria-hidden="true"></span>
      <span aria-hidden="true"></span>
    </a>
  </div>
</nav>

navbar.component.scss

@import "../../scss/fonts";

.navbar {
  background: #ffaaa6;
}

.navbar-brand {
  font-family: $pacifico;
}

标签： cssangularsassbulma