【发布时间】：2012-04-01 21:10:19
【问题描述】：
有人知道正确使用“CSS 图像大小（我的意思是宽度和高度）的动态变化”的图像裁剪吗？
如果有原始图像尺寸（例如尺寸：400 像素 x 400 像素）和宽度：100%，则所有图像裁剪都可以正常工作；
但是，如果向用户显示尺寸为 1500px x 1500px 的图片并仅使用 css 将其缩小到 100px x 100px（因为 1500px - 通常对于屏幕来说太大而且看起来不漂亮） - 在这种情况下，图像裁剪器就是我之前看到的发出错误或使用初始值制作缩略图（左上角）。我需要从 Facebook 相册中提取图片，而且它们通常都太大了。
我知道可以在裁剪前缩小图像，但会降低质量。
顺便说一句，看起来有办法做到这一点，因为即使我在 css 中“动态”更改图像的大小，在 jCrop 预览缩略图中看起来也很好。只是预览！完成裁剪后的图片不正确，我说过会有左上角的图片。
【问题讨论】：
-
CSS 不会“裁剪”图像 - 它可能会用溢出遮盖部分图像：隐藏在缩小尺寸的容器中。
-
是的，是的，我知道，对不起我的英语 =（我不是指在 css 中裁剪，只是减少 VIEW 以使其更舒适，这在我们想要裁剪的图像太大的情况下会很有用（例如 4.000 像素 x 4.000 像素）
-
img { width: 400px; height: 400px }可以解决问题，但质量取决于浏览器。 -
是的，这就是我之前所说的，如果我做了这个技巧 - 图像裁剪器开始计算错误的包皮环切坐标。好的，我的问题是：如何在不损失图像质量的情况下裁剪大图像（约 2.000 像素，2.000 像素）？
-
crop = 物理移除图像的外边缘。例如拿剪刀剪掉打印出来的图片的一部分。您所追求的是调整大小/缩放，这会保留图像的所有“外观”，但会减少像素总数。根据定义，调整大小也会降低质量，因为您正在减少像素数。