如何在保持比例和裁剪效果的同时，仅使用HTML/CSS（即无服务器代码）调整图像大小。 细节：我希望将其大小调整为指定的宽度，保持比例，并且如果高度大于指定值以将其裁剪到指定的高度？如何在保持比例的同时在纯HTML/CSS中调整图像大小？
其实，我知道如何使用一些服务器代码，但我不想这样做。这意味着使用不同的文件参考，并参考图片<img src="picture.php" />。我需要在显示它的同一页面中处理图像。
“困扰”我是，我必须发送图像标题，因此页面上的其他内容都不会显示。
有没有办法做到这一点？也许从纯HTML/CSS？ ：P
我做了一个这样的功能（除了“裁剪”的东西），它只返回width="" height=""，我用它这样<img src="image.jpg" resize("image.jpg") />，但我不明白我该怎么做那个裁剪。 。
感谢
好的，所以我设法找到了一种方法，从HTML/CSS。整个想法就是要摆脱“extraheight”的：
<div style="width:200px;height:200px;overflow:hidden;" >
<img src="image.jpg" width="200px" height="auto">
</div>
第一我的形象被重新调整到所需的宽度（保持比例），然后给出一个固定的高度，包含股利和setting overflow to hidden使脚本只显示图像的所需部分。
，因为浏览器依赖于它content-type标题来诠释它无法呈现图像和HTML在相同的文件。
HTML文档的content-type标题通常设置为text/html，而图像的内容类型为image/*（替代*为图像格式）。您可以将图像数据打印到HTML文档，但由于浏览器被指示将其解释为text/html而不是图像，其内容将会出现乱码。
您需要将<img>标记链接到您所描述的PHP文件。我不确定为什么这是一个问题;这是正确的方式去做。您当然可以通过在HTML中操作其尺寸来裁剪图像，但我不建议您这样做。
有没有办法在同一个文件中做到这一点？ – kmunky 2010-02-09 22:52:19
@kmunky有一种方法...如果我理解你的权利，你想内联图像数据。 – hurikhan77 2010-02-09 23:33:28
创建帮手，如：
<?php
echo '<img src="' . image_resize($path_to_image, SIZE_X, SIZE_Y) . '" />';
?>
所以这个助手将检查，如果调整后的图像已创建或创建新的。在这两种情况下，它都会将正确的url返回给新图像。
我认为ImageMagick支持“调整大小以适合”和“调整大小以填充”方法，后者就是您要查找的内容。
在将img标签写入输出缓冲区之前，将图像保存到生成的建议文件名中，并让'识别'为您提取此图像的宽度和高度。
如果您不想使用单独的文件，而是希望图像数据内联，请尝试使用较新的Web浏览器支持的data-uri method。这在html文件内嵌入了图像的二进制数据流，因此它被嵌入。
您可以使用phpThumb来动态调整和裁剪图像。它使用GD库从图像JPEG，PNG，GIF等创建缩略图。
对于它的价值，我可以从父div中删除样式属性。只需在img标签上使用width =“200px”和height =“auto”，然后用div为我工作。 – 2017-11-06 22:10:07