Question

使用 HTML5 和 CSS3 我希望有一个图像使用其包含div的完整高度。删除我的大部分代码后，我留下了这个最小的片段来表示问题：

<!DOCTYPE html>
<div style="overflow: hidden; border-radius: 15px; background-color: aqua;"><img style="width: 100%;" src="img/napkin.jpeg"></div>

该片段产生以下结果：

在最底部有一条浅蓝色的条纹我想摆脱（我故意给它那种颜色以便可见）。知道如何实现这个目标吗？

编辑：我已经了解了图像的默认显示。然而，有一件事仍困扰着我。评论<!DOCTYPE html>可以解决问题。知道为什么吗？

Answer 1

在display: block元素上设置<img />。默认情况下，img标记为display: inline;，其中包含底部的边距。