Much like how the video tag can provide multiple source attributes so an mp4 video can fall back to an ogg video, I would like to get an svg image to fall back to an png image.
The <img> tag has two required attributes: src - Specifies the path to the image. alt - Specifies an alternate text for the image, if the image for some reason cannot be displayed.
The <img> src attribute is used to specify the URL of the source image. Syntax: <img src="URL"> Attribute Values: It contains single value URL which specifies the link of source image.
The required src attribute specifies the URL of the image. There are two ways to specify the URL in the src attribute: 1. Absolute URL - Links to an external image that is hosted on another website.
At the time of the question it wasn't possible. But now it is OK to do like this:
<picture> <source srcset="mdn-logo.svg" type="image/svg+xml"> <img src="mdn-logo.png" alt="MDN"> </picture>
See docs on MDN
No, it cannot.
However, you can fake it using CSS background images.
To avoid displaying the broken image glyph, you might want to not use an <img>
tag at all and instead use two nested elements with different background images. (Note that that would hurt accessibility)
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With