是否应该为HTML中的IMG指定高度和宽度属性？

  • Z时代
  • 2024-01-10
  • 分类：问答

如果我知道要通过图像标签显示的图像的高度和宽度，我应该包括height和width属性，还是仅将信息放入CSS中？或两者？

例如

<img src="profilepic.jpg" height="64" width="64" />

要么

<img src="profilepic.jpg" height="64" width="64" style="height: 64px; width: 64px;" />

要么

<img src="profilepic.jpg" style="height: 64px; width: 64px;" />

回答：

根据Google Page Speed，您应始终在image标签中定义宽度和高度。但是，要验证您不能使用样式标签。

另外，您应始终指定与实际图像相同的高度和宽度，以使浏览器不必像调整大小一样对其进行任何修改。

我建议这样做

<img src="..." height="20" width="50">

有人在评论中建议不添加任何属性会更快。根据Google的说法（并非所有浏览器知识的终结）

如果在包含文档中未指定尺寸，或者指定的尺寸与实际图像的尺寸不匹配，则下载图像后，浏览器将需要重排并重新绘制。为防止回流，请在HTML标记或CSS中指定所有图像的宽度和高度。-

鉴于此，您可以在CSS中进行img标注，但要进行验证，必须在CSS文件中进行，而不是内联。

顺便说一句，Google Page Speed是一系列旨在更快地呈现页面的技巧。

以上是 是否应该为HTML中的IMG指定高度和宽度属性？ 的全部内容， 来源链接： utcz.com/qa/423131.html

回到顶部