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> 标签