我想将图像包含在250 x 250 div中,强制图像调整大小,但不能拉伸。我该怎么做?顺便说一句,图像通常会大于div本身,这就是调整大小的原因。
<div id = "container"> <img src = "whatever" /> </div> #container { width:250px; height:250px; border:1px solid #000; }
这是一个可以编辑的jsfiddle:
解决方法
使用最大宽度和最大高度。它将保持纵横比
#container img { max-width: 250px; max-height: 250px; }