My default styles for images…

<style>
    img {
        display: block;
        width: 100%;
        height: auto;
        margin: auto;
    }
</style>

The HTML part…

<picture>
    <source media="(min-width: 1025px)" srcset="image-1260px.jpg">
    <source media="(min-width: 769px) and (max-width: 1024px)" srcset="image-1024px.jpg">
    <source media="(min-width: 481px) and (max-width: 768px)" srcset="image-768px.jpg">
    <source media="(max-width: 480px)" srcset="image-480px.jpg">
    <img src="image-1260px.jpg">                   
</picture>

Leave a Reply

Your email address will not be published. Required fields are marked *