使用CSS或使用CSS调整图像大小是更好/更快 <img> 标签？

Question

我想知道调整图像大小的更好/更快的方法是什么。

通常我会用CSS调整图像大小，但是大学告诉我通过使用width属性，例如

<img width="size" [..]> 

浏览器会更快地呈现页面。

谁知道这是真的吗？

Answer 1

如果您调整实际图像的大小，而不是您希望浏览器将其渲染到的尺寸，则会更快。

Answer 2

在img和object s的情况下， width和height是语义的。 它们为图像提供元数据，因此依靠这些属性是完全正确的IMO，以告诉用户代理在图像完全渲染之前它应该将元素预先设置为X维度。

Answer 3

您应该设置每个img标记的宽度和高度属性。 它加速了渲染页面，因为浏览器不等待加载的css文件和图像。

Answer 4

如果我们坚持演示与结构，我会把你的图像大小放在CSS中。 速度真的无所谓，浏览器必须等待图像加载，所以编写和渲染页面所需的速度是不可测量的，除非你的CSS无法加载...

Answer 5

对于像这样的非常一般的问题，有点难以给出确切的答案，但我认为通常最好不要在HTML或CSS中调整图像大小 - 使图像文件成为正确的尺寸。

忽略这一点，我不认为两者之间可能存在任何可察觉的差异。