10

我以前从未想过这个，但我真的很好奇。所以这里是html：

<img src="/employees/img/uploads/users/2013-09-12-115644edif.jpg" alt="Employee" class="user_img" />

这是CSS：

.user_img{
width: auto;
max-height: 200px;}

原始图片大小为 1.5 MB，因此在应用 css 后，它的视觉大小确实减小了。我想知道在这种情况下用户的浏览器是否需要加载全尺寸图片，还是只加载小图片？

4

5 回答 5

10

CSS 由用户的 Web 浏览器应用，该浏览器在其本地 PC 上运行。Web 浏览器下载图像后，它才会应用 CSS 缩放以显示小于实际图像大小的图像。

结果，答案是否定的。用户必须下载整个文件，即使使用 CSS 将其缩小。

要在发送前缩小图像，您可以使用 PHP 等服务器端语言，并生成适合最终显示尺寸的图像缩略图。这不仅会使您的页面加载速度更快，而且还会降低带宽需求。

于 2013-09-12T11:23:23.943 回答
2

通过 CSS 缩放发生在浏览器渲染页面时，在它下载完整图像之后，所以没有。

于 2013-09-12T11:24:45.010 回答
1

HTML、CSS 和 JavaScript 是客户端语言。一切都转移到客户端，然后进行转换。

如果要在将图像发送到客户端之前缩小图像的大小，则必须使用 PHP 等服务器端语言。

于 2013-09-12T11:26:34.363 回答
0

您调整图片大小（按比例缩小）的事实不会影响图像的“物理”大小。否则每个人都会使用 css 调整大小作为“文件”大小调整技术。

于 2013-09-12T11:24:41.277 回答
0

不，CSS 只会缩小（或放大）你的图片，但文件的大小永远不会改变。

于 2013-09-12T11:24:59.680 回答