应用于图片的 css 是否会减小其文件大小

Question

我以前从未想过这个，但我真的很好奇。所以这里是 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 后，它的视觉大小确实减小了。我想知道的是，在这种情况下，用户的浏览器是否需要加载全尺寸图片，还是只会加载小图片？

Answer 1

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

因此，答案是否定的。用户必须下载整个文件，即使使用 CSS 将其大小调整为更小的文件也是如此。

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

Answer 2

当浏览器在下载完整图像后呈现页面时，通过 CSS 进行缩放，所以没有。

Answer 3

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

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

Answer 4

调整图片大小（缩小）不会影响图像的"物理"大小。否则，每个人都会使用 css 大小调整作为"文件"大小调整技术。

Answer 5

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