HTML <source> srcset 属性

在 <picture> 标签中使用 <source> 来设置不同屏幕显示的图片：

<picture>
  <source media="(min-width:650px)" srcset="https://static.jyshare.com/images/runoob-logo.png">
  <source media="(min-width:465px)" srcset="https://static.jyshare.com/images/code-icon-script.png">
  <img src="https://static.jyshare.com/images/mix/hjkg_icon.png"  style="width:auto;">
</picture>

浏览器支持

表格中的数字表示支持该属性的第一个浏览器版本号。

属性
srcset	38.0	13.0	38.0	9.1	25.0

定义和用法

srcset 属性用于不同情况下显示的图片 URL。

<source> 应用于 <picture> 标签时需要使用到该属性。

HTML 4.01 与 HTML5之间的差异

<source> 标签是 HTML5 中的新标签。

语法

<source srcset="URL">

属性值

值	描述
URL	规定媒体文件的 URL。可能的值：绝对 URL - 指向另一个网站（比如 href="https://www.runoob.com/horse.ogg"）相对 URL - 指向网站内的一个文件（比如 href="horse.ogg"）

值

描述

URL

规定媒体文件的 URL。

可能的值：