Jquery 用不同的尺寸/比率定位img并将其填入div中

我有一个网站，用户上传图像到，图像处理是在服务器上进行的，大小是400px*400px。图像可能有不同的原始大小，无法控制。当显示它们时，我无法在200px*200px分区中正确定位它们。它要么被压缩/拉伸，要么留下一个信箱状的空间。这里的首选是以保持正确的比率和居中为代价裁剪图像。有没有已知的jquery/css方法可以这样做

编辑

.container{width:200px; height:200px;}
.container img{width:100%;}

这是我发现的最接近的解决方案，但它根本不令人满意（高度/宽度根据图片明显变化）。。。目前，我们使用信箱来“缩放”图像。

---

还有Pixel Daily的photo stack插件，用于提供100%的图像高度和宽度

试一试

对于现代浏览器（没有IE8或更低版本），您可以通过css仅使用属性“cover”和后台属性inline来实现这一点

 <ul>
    <li style="background:url('image/path.jpg') center center;background-size:cover"></li>
    <li style="background:url('image/path.jpg') center center;background-size:cover"></li>
</ul>

---

由于我使用css插件创建了一个类似照片堆栈的效果，因此我无法更改背景图像，我想应该以某种方式动态进行定位。这既不会裁剪图像，也不会将纵横比保持在divMy bad内。。谢谢，还添加了一些有关该问题的更多信息。

 <ul>
    <li style="background:url('image/path.jpg') center center;background-size:cover"></li>
    <li style="background:url('image/path.jpg') center center;background-size:cover"></li>
</ul>