HTMLSourceElement: width 屬性
HTMLSourceElement 介面的 width 屬性是一個非負數,表示影像資源的 CSS 畫素寬度。
該屬性僅在當前 <source> 元素的父元素是 <picture> 元素時才生效。
它反映了 <source> 元素的 width 屬性。
值
一個非負數,表示影像資源的 CSS 畫素寬度。
示例
html
<picture id="img">
<source
srcset="landscape.png"
media="(width >= 1000px)"
width="1000"
height="400" />
<source
srcset="square.png"
media="(width >= 800px)"
width="800"
height="800" />
<source
srcset="portrait.png"
media="(width >= 600px)"
width="600"
height="800" />
<img
src="fallback.png"
alt="Image used when the browser does not support the sources"
width="500"
height="400" />
</picture>
js
const img = document.getElementById("img");
const sources = img.querySelectorAll("source");
console.log(Array.from(sources).map((el) => el.width)); // Output: [1000, 800, 600]
規範
| 規範 |
|---|
| HTML # dom-dim-width |
瀏覽器相容性
載入中…