HTML动态裁剪

Question

我目前无法在桌面上显示图片。

图像都具有不同的宽高比。图像的不同宽高比使图像表看起来混乱。

要解决此问题，我想裁剪需要裁剪的部分，使图像完全正方形。我已经用PHP脚本缩小了尺寸。

棘手的部分是我只能使用HTML，CSS和PHP服务器端，其他一切都不受支持。

那么有什么方法可以动态地，不知道图像裁剪的大小变成正方形？

Answer 1

使用指定的width和height（所需方格的大小）设置div，并将background-image设置为居中未知大小的图片。然后看起来图像被“裁剪”，意味着每个div的大小都不可见。

Answer 2

使用HTML5有多种选择:(您已使用HTML5对其进行了标记，因此我假设您可以使用它）

1. 您可以使用图像功能将图像放大/缩小到所需的大小：

void drawImage(Object image, float dx, float dy, [Optional] float dw, float dh);

指定所需宽度＆amp;高度，它将适当地缩放图像，但如果有太多的缩放...你会看到明显的文物

或者

2您可以使用相同功能的另一个变体，您可以在其中切割由sx，sy，sw和amp;定义的部分图像。 sh并显示在由dx，dy，dw和amp; DH

void drawImage(Object image, float sx, float sy, float sw, float sh, float dx, float dy, float dw, float dh)