html - 无法调整图像的高度

Question

代码:

<div style="text-align:center;">
<img src="https://gsamaras.files.wordpress.com/2016/04/satou.jpg" style="height:100%;" alt="satou" />
Match for the newborn son of Marialena Satou, 3/4/2016. Wish him health! :)
</div>

我的 site 中的结果.

没有样式，它会是一样的:

我想降低图片的高度。我在这里缺少什么？

Answer 1

您可以用 span 或 div 包装 img:

<span class="img-wrapper">
    <img src="...">
</span>

然后为这两个元素设置样式:

.img-wrapper {
    display: inline-block;
}

.img-wrapper img {
    width: 50%; 
}

将宽度设置为 50% 也会将高度调整为 50%。