HTML <source> srcset 屬性

HTML <source> 標簽

定義和用法

srcset 屬性規定在不同情況下使用的圖像的 URL。

當 <source> 用于 <picture> 時，此屬性是必需的。

實例

一個包含兩個源文件和一個后備圖像的 <picture> 元素：

<picture>
  <source media="(min-width:650px)" srcset="img_pink_flowers.jpg">
  <source media="(min-width:465px)" srcset="img_white_flower.jpg">
  <img src="img_orange_flowers.jpg" alt="Flowers" style="width:auto;">
</picture>

親自試一試

語法

<source srcset="URL">

屬性值

值 描述
URL

規定圖像的 URL。

可能的值：

  • 絕對 URL - 指向另一個網站（如 href="http://www.example.com/flower.jpg"）
  • 相對 URL - 指向網站內的文件（如 href="flower.jpg"）

瀏覽器支持

表中的數字注明了首個完全支持該屬性的瀏覽器版本。

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
38.0 13.0 38.0 9.1 25.0

HTML <source> 標簽