html - 当我添加 Bootstrap 样式表时，我的左上角 png 变得不可见

Question

我的图像 (.png) 格式工作正常，但是一旦我将 Bootstrap 库添加到 html，图像就会变得不可见，但链接仍然有效。

CSS:

.menu-icon img {
      width: 14vw;
      height: 5vh;
      padding-bottom: 20%;
      padding-top: 10%;
      padding-left: 4%;
      position: block;
    }

HTML:

<a href="index.html" class="menu-icon">
<img src="img/image.png">
</a>

注意:其他图像 .png 仍然有效，但它较小且位于菜单底部。

Answer 1

如果您将高度更改为像素并修改框大小，它甚至可以使用 Bootstrap :

<style type="text/css">
       .menu-icon img {
           width: 14vw;
           height: 55px;
           padding-bottom: 20%;
           padding-top: 10%;
           padding-left: 4%;
           position: block;
           box-sizing: content-box !important;
       }
</style>