HTML <source> srcset 属性

HTML <source> 标签

实例

具有两个源文件和备用图像的 <picture> 元素：

<picture>
  <source media="(min-width:600px)" srcset="tulip-yellow.jpg">
  <source media="(min-width:600px)" srcset="tulip-red.jpg">
  <img src="tulip.jpg" alt="Flowers" style="width:auto;">
</picture>

亲自试一试

定义和用法

srcset 属性规定要在不同情况下使用的图像的 URL。

在 <picture> 中使用 <source> 时，需要此属性。

浏览器支持

表格中的数字注明了完全支持该属性的首个浏览器版本。

属性 Chrome Internet Explorer / Edge Firefox Safari Opera
srcset 38.0 13.0 38.0 9.1 25.0

语法

<source srcset="URL">

属性值

值 描述
URL

规定图像的 URL。

可能的值：

  • 绝对 URL - 指向另一个网站（例如 href="http://www.example.com/flower.jpg"）
  • 相对 URL - 指向网站内的文件（如 href="flower.jpg"）

HTML <source> 标签