使用PHP或CSS调整图像大小？

Question

基本上我有div，其中包含用户的照片。 为了让照片完全填满div，我必须调整照片的大小。

• 问题是，我对编程比较陌生，我不确定哪种方法最适合调整图像以适应div（我猜最强大的方法是PHP）。

我的问题是：我应该使用PHP函数调整图像大小，还是应该使用CSS设置指定的照片尺寸？ （寻找最强大的方法）

Answer 1

你可以看到StackOverflow是如何做到的......

<img src="https://www.gravatar.com/avatar/6bc2ad4c62572ad8df0b54d91e17617f?s=48&amp;d=identicon&amp;r=PG" alt="" width="24" height="24" class="avatar-me js-avatar-me">

现在，这对于缩小尺寸非常有用，对于图像尺寸调整则更少。让用户上传大小超过您将显示的最大尺寸的内容。否则你会得到＆＃34;拉伸＆＃34;质量差。

＆＃13;

＆＃13;

<img src="https://www.gravatar.com/avatar/6bc2ad4c62572ad8df0b54d91e17617f?s=48&amp;d=identicon&amp;r=PG" alt="" width="324" height="324" class="avatar-me js-avatar-me">

＆＃13;

＆＃13;

＆＃13;

当然，长宽比是另一个因素。

Answer 2

你一定要使用CSS调整大小。您可以使用PHP函数调整大小，但是您很可能必须调整图像大小，保存其调整大小的副本，然后将其提供给最终用户。在CSS中，您只需在用户端缩放图像的显示尺寸，而无需修改图像本身。

Answer 3

你提到你是编程新手。出于这个原因，我将Bootstrap视为一个框架。您可以通过将从页面下载的Bootstrap的CSS文件添加到CSS文件目录并在HTML标题中链接到该文件来实现此目的。

您可以使用Bootstrap的网格系统来确保图像占据div的全部范围：

<div class="col-md-12">

您还可以使用img-responsive类，以便它响应地处理图像显示：

<img class="img-responsive" src="images/sample.png">

如果关注的是图像质量的调整，因为它会延伸到完全填充div，最简单的解决方案是从用户处请求更高分辨率的图像来使用。