在div中插入具有不同比率的图像而不改变尺寸

Question

我创建了一个具有特定高度和宽度的div。在里面，我插入了图像。问题是如果图像具有相同的尺寸，则div是相似的。但如果图像的尺寸不同，那么div也会发生变化。

例如，请查看以下页面： http://versatilemobitech.com/portfolio/

所有图像的尺寸都是180 * 200像素，这就是为什么所有的div看起来相似（方形尺寸的框具有白色背景）。 我的问题是，我们不能制作具有特定尺寸的div，然后插入不同宽高比的图像而不改变div的尺寸，因为它可以节省从一直调整图像大小到相同尺寸的时间。

Answer 1

为图像样式添加样式

max-width: 100%; 
max-height: 100%; 
width: 100%; 
height: auto;

OR

max-width: 100%; 
max-height: 100%; 
width: auto; 
height: 100%;

它应该有用

编辑：您的父div必须具有属性position: relative;

Answer 2

试试这样：

.image{
max-width:180px;
max-height:200px;
}

这将使用宽高比

调整图像