HTMLImageElement: naturalWidth 属性

Baseline 已广泛支持

此特性已相当成熟，可在许多设备和浏览器版本上使用。自 ⁨2015 年 7 月⁩以来，各浏览器均已提供此特性。

HTMLImageElement 接口的只读 naturalWidth 属性返回图像的内在（自然）、经过像素密度校正后的宽度，单位是 CSS 像素。

这是图像在没有任何约束的情况下绘制时的宽度；如果您既没有为图像指定宽度，也没有将图像放置在限制或明确指定图像宽度的容器中，那么这个值就是图像的 CSS 像素宽度。

对应的 naturalHeight 方法返回图像的自然高度。

注意： 大多数情况下，自然宽度是服务器发送的图像的实际宽度。然而，浏览器可能会在将图像推送到渲染器之前修改它。例如，Chrome 会降低低端设备的图像分辨率。在这种情况下，naturalWidth 会将这种浏览器干预修改后的图像宽度视为自然宽度，并返回该值。

值

一个整数值，表示图像的内在宽度（以 CSS 像素为单位）。这是在没有为图像设定约束或特定值时，图像自然绘制的宽度。与 width 属性的值不同，此自然宽度已根据其显示设备的像素密度进行了校正。

如果内在宽度不可用——无论是由于图像未指定内在宽度，还是由于无法获取此信息所需的图像数据不可用——naturalWidth 返回 0。

请参阅 HTMLImageElement.naturalHeight 获取示例代码，该代码以其自然的“密度调整”大小和受页面 CSS 及其他因素影响的渲染大小显示图像。

规范
HTML # dom-img-naturalwidth-dev

此页面最后由 MDN 贡献者于 2024 年 7 月 26 日修改。