HTMLImageElement: src 屬性

值

當只提供單個影像而不是一組影像（瀏覽器會從中選擇最適合視口大小和顯示畫素密度的影像）時，src 屬性是一個字串，用於指定所需影像的 URL。這可以透過在 HTML 中使用 src 內容屬性來設定，或者透過以程式設計方式設定元素的 src 屬性來設定。

如果您使用 srcset 內容屬性為不同顯示畫素密度提供多個影像選項，則 src 屬性指定的 URL 的用途有兩種：

• 作為不支援 srcset 的瀏覽器的備用（fallback）。
• 作為指定 srcset 中尺寸乘數為 1x 的影像的等效項；也就是說，由 src 指定的影像用於低密度螢幕（例如，典型的 72 DPI 或 96 DPI 顯示器）。

此外，如果您同時使用 src *和* sizes（或相應的 sizes 內容屬性）*以及* srcset 來根據視口大小選擇影像，則 src 屬性僅用作不支援 sizes 和 srcset 的瀏覽器的備用；否則，它根本不會被使用。

示例

指定單個影像

HTML

<img
  src="grapefruit-slice-332-332.jpg"
  width="160"
  alt="Slices of grapefruit, looking yummy." />

結果

將 src 與影像集結合使用

當使用 srcset 屬性的影像集時，src 用作舊瀏覽器的備用，或者用作影像的 1x 尺寸。

HTML

結果

為基於視口的影像選擇指定備用

當透過同時指定 sizes 屬性從 srcset 中進行基於視口的影像選擇時，src 屬性將作為備用，用於不支援基於視口的影像選擇的瀏覽器。*支援* 基於視口的影像選擇的瀏覽器在這種情況下會忽略 src。

HTML

結果

規範

瀏覽器相容性