如何将所有图像设置为相等的40x40尺寸而不拉伸？
我尝试执行以下操作，但没有成功：
<style>
.img-container {
width: 40px;
height: 40px;
}
.pic {
width: 100%;
max-width: 100%;
}
</style>
<div class="img-container">
<img src="image_path" class="pic" />
</div>
我被迫使用overflow: hidden，它基本上会裁掉一半。有没有办法用jQuery或Bootstrap实现相等的宽度和高度？
您确定这不是您想要的吗？图像将按比例缩放到容器精细的位置，剩余空间将被容器的背景填充。而且，无论尺寸如何，图像都完美居中。
.img-container {
width: 40px;
height: 40px;
border: 1px solid;
position: relative;
}
.img-container img {
width: 100%;
height: auto;
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
}<div class="img-container">
<img src="http://lorempixel.com/400/200" alt="Random image">
</div>本文收集自互联网，转载请注明来源。
如有侵权，请联系[email protected] 删除。
我来说两句