【发布时间】：2023-03-27 11:05:01
【问题描述】：
<div style="overflow:hidden; height:100px; width:100px;">
<img src="etc.jpg" width:"100px" /></div>
我将img 转换为div。 img 的高度未定义，但大于 div 的 100px。
我想将img 垂直居中并隐藏顶部和底部溢出。
我仍然无法理解如何做到这一点......
丹尼尔
【问题讨论】：
【发布时间】：2023-03-27 11:05:01
【问题描述】：
您可以尝试将图像的 margin-top 属性设置为负百分比。例如；
div img {margin-top: -50%;}
只需使用百分比值，您就会发现一些有用的东西。
【讨论】：
-
负边距应根据图像的高度。但是在这个 sn-p 中，百分比应用于父级的高度，这无济于事。调整百分比只会解决高度不变的特定图像的问题，而不是任何图像。
这对你有用吗？
<div style="overflow:hidden; height:100px; width:100px;">
<image src="etc.jpg" style="width:100px; position: relative; bottom: 25%;" />
</div>
嗯，当图像适合时结果有点奇怪
【讨论】：
-
这仅适用于图像高度为 100 像素的情况。否则它将无法正确对齐，因为百分比是根据父属性评估的。