在 HTML 中指定图像的宽度和高度属性仍然相关吗? [英] Is it still relevant to specify width and heigth attribute on images in HTML?

问题描述

我发现了一个类似的问题在这里，答案是:您应该始终在图像标签中定义宽度和高度."但它是从 2009 年开始的.

I found a similar question here, with the answer: "you should always define the width and height in the image tag." But it is from 2009.

与此同时，前端的许多事情都发生了变化.我们现在都在为多种设备和尺寸(移动设备、平板电脑、台式机...)进行响应式页面设计.

In the meantime, many things has changed on frontend. We are all doing responsive page design now, for many devices and sizes simultaneously (mobile, tablet, desktop...).

所以，我想知道是否仍然需要指定宽度和高度属性，以及出于什么原因(为了响应、页面速度、SEO...)?

So, I wonder is it still necessary to specify the width and height attributes, and for what reason (for responsive, page speed, SEO...)?

推荐答案

img 元素具有宽度和高度属性，但它们在任何 DOCTYPE 下都不是必需的.

An img element has width and height attributes, but they're not required under any DOCTYPE.

宽度和高度属性只是必需"或相关的，以保留页面上的空间并防止页面在加载时移动 - 这很重要.这可以使用 CSS 而不是提供足够快的 CSS 加载来实现 - 无论如何它很可能在图像之前加载，所以一切都应该很好.

Width and height attributes were only 'required' or relevant to reserve the space on the page and prevent the page moving around as it loads - which is important. This can be achieved using CSS instead providing the CSS loads quickly enough - it is likely to load before the images anyway, so all should be good.

也可以(并且有效)只指定一个属性，宽度或高度，浏览器将计算省略的值以保持正确的纵横比.

It is also possible (and valid) to specify just one attribute, width or height and the browser will calculate the omitted value in order to maintain the correct aspect ratio.

如果需要，您可以在属性中指定百分比值.您不需要为此使用 CSS，如果这是您的意思的话.

You can specify percent values in the attributes if required. You don't need to use CSS for this, if that is what you are implying.

此外，还需要添加 - 在 HTML5 下，宽度和高度只能采用像素值，即有效的非负整数.

Also, it is relevant to add - Under HTML5 the width and height can only take a pixel value, in other words a valid non-negative integer.

是否使用宽度和高度属性取决于您的设计.如果您有很多不同大小的图片，您是想将所有尺寸都放在 CSS 中还是将它们包含在 img 中?

Whether you use the width and height attributes can depend on your design. If you have lots of differently sized images, do you want to lump all the dimensions in the CSS or include them with the img?

这篇关于在 HTML 中指定图像的宽度和高度属性仍然相关吗?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！