无法更改img的高度

Question

我需要降低图像的高度，但是px或％无效。徽标是img，在菜单下应该是几px，但是因为我无法降低它的显示效果，所以它像胶水一样。

.Logo {
  display: block;
  margin-left: auto;
  margin-right: auto;
  width: 50%;
  height: 5px;
}

<!-- Logo-->
<div class="Logo">
  <img src="https://png.pngtree.com/element_our/md/20180411/md_5ace0628840fa.jpg">
</div>
<!-- Sobre nós -->


<!-- Produto -->


<!-- Nossa equipe -->

<!-- Contato -->

Answer 1

您必须调整图像的大小，而不是周围的div。

.Logo img{
  width: 50%;
  height: 5px;
}

Answer 2

您需要将类.Logo添加到img标记中，而不是div。

<div>
    <img class="Logo" src="./img/logoG.png">
</div>

或者，在您的CSS中，您可以执行以下操作：

.Logo img{
    display: block;
    margin-left: auto;
    margin-right: auto;
    width: 50%;
    height: 5px;
}

Answer 3

CSS是关于特异性的。在您的代码中，您定位的是徽标的父元素-但是当您要设置对象的高度或宽度时，需要直接定位它。

.Logo img {
    width: 100%;
    height: 5px;
}

Answer 4

在img中然后在CSS中添加一个类（例如imageClass）：

.imageClass {
  width: 50%;
  height: 5px;
}