HTML <source> Tag
The source tag specifies numerous media resources for media components like <video>, <audio>, and <image>.
The <source> element enables you to supply alternative video/audio/image files from which the browser may select based on browser support or viewport width. The browser will select the first <source> that it supports.
Syntax
<source src="___" type="___">Example
x
<html><body><p>To hear a sound, press the play button:</p><audio controls> <source src="https://webtutor.dev/audio/mariodie.wav" type="audio/wav"> <source src="https://webtutor.dev/audio/raising-me.mp3" type="audio/mpeg"> The audio element is not supported by your browser.</audio></body></html>Attributes
| Attribute | Value | Description |
|---|---|---|
| media | media-query | Accepts any valid media query that would typically be defined in a CSS style sheet. |
| sizes | Image sizes for various page layouts are specified. | |
| src | URL | When used in <audio> and <video>, <source> is required. Specifies the media file's URL. |
| srcset | URL | When using <source> in <image>, this is required. Specifies the URL of the picture to be used in certain scenarios. |
| type | MIME-type | Specifies the resource's MIME type. |
Supported Browsers
| Element | Chrome | Firefox | Safari | Edge / IE | Opera |
|---|---|---|---|---|---|
| <source> | Yes | Yes | Yes | Yes | Yes |