可以说我有div with width: 300px and height: 200px
我想要其中的任何图像div无论图像大于还是小于，都水平和垂直居中div;
对于较小的图像margin: 0 auto效果很好，但较高的图像向右突出并且不居中。
对于更大的图像，此方法有效：
height: 100%;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
我找不到这些的任何组合，也没有找到任何解决方案如何完美地居中该图像。
Add position: absolute to img and position: relative to div
.el {
position: relative;
width: 100px;
height: 100px;
border: 1px solid black;
margin: 50px 150px;
}
img {
opacity: 0.4;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
position: absolute;
}
<div class="el">
<img src="http://placehold.it/350x150">
<img src="http://placehold.it/50x50/000000/ffffff">
</div>
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)
