HTML - Picture element

1 - About

The picture element is a container that is used to group different source versions of the same image.

The browser can then choose the right image depending on :

  • its capability ( may not yet support the format)
  • and device capabilities (like pixel density and screen size)

3 - Example


<picture>
 <source type="image/svg+xml" srcset="pyramid.svg">
 <source type="image/webp" srcset="pyramid.webp">
 <img src="pyramid.png" alt="large PNG image...">
</picture>

An img element with a src attribute should always be specified as fallback

4 - Documentation / Reference


Data Science
Data Analysis
Statistics
Data Science
Linear Algebra Mathematics
Trigonometry

Powered by ComboStrap