
Picture tag is a responsive images method to control which image resource a user agent presents to a user, based on resolution, media query and/or support for a particular image format.
Browser Support
This feature is already supported by a few major browsers including Chrome, Microsoft Edge and Opera.
Code Example
You can use Picture tag like this:
<picture> <source media="(min-width: 650px)" srcset="images/kitten-stretching.png"> <source media="(min-width: 465px)" srcset="images/kitten-sitting.png"> <img src="images/kitten-curled.png" alt="a cute kitten"> </picture>
More Information
More information can be found here.
No Comments