0

我有一个用户上传图像的网站，图像处理在服务器上进行，大小为 400px*400px。图像可能有各种无法控制的原始尺寸。显示它们时，我无法将它们正确定位在 200px*200px div 中。它要么被挤压/拉伸，要么留下像空间一样的信箱。这里的偏好是以保持正确比例和居中为代价来裁剪图像。任何 jquery/css 已知方法可以做到这一点？

编辑

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

这是我发现的最接近的解决方案，但它根本不令人满意（高度/宽度显然根据图片而变化）......目前我们使用信箱来“缩放”图像。还有使用PhotoStack的 Pixel Daily 的照片堆栈插件

4

2 回答 2

0

给图像高度和宽度 100%

尝试

.imgClass{  //your class name
height:100%;
width:100%;
}
于 2013-01-02T19:46:28.327 回答
0

对于现代浏览器（没有 IE8 或更低版本），您可以通过 css 仅使用background-size属性“cover”和内联背景属性来实现这一点。

 <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>

http://jsfiddle.net/EXpb2/1/

于 2013-01-02T22:41:44.913 回答