css - 垂直对齐图像居中溢出：隐藏

Question

<div style="overflow:hidden; height:100px; width:100px;">
<img src="etc.jpg" width:"100px" /></div>

我已经img进入了一个div. 的高度img未定义，但大于 100px 的div.

我想垂直居中img并隐藏顶部和底部溢出。

我仍然无法理解如何做到这一点......

丹尼尔

Answer 1

您可以尝试将图像的 margin-top 属性设置为负百分比。例如;

div img {margin-top: -50%;}

只需使用百分比值，您就会发现一些有用的东西。

Answer 2

这对你有用吗？

 <div style="overflow:hidden; height:100px; width:100px;">
   <image src="etc.jpg" style="width:100px; position: relative; bottom: 25%;" />
 </div>

嗯，当图像适合时，结果有点奇怪