source
I. Description
The HTML <source>
element
is used to specify the location of a file for a audio, picture, or video element.
The source element does not have any content, and it does not require a closing tag. Generally a video, audio, or picture element will contain multiple source elements each of which specifies the same file in a different format. Web browsers will attempt to load each file and play or display the first file that is compatible with the web browser.
II. Examples
<!DOCTYPE html>
<html>
<head>
<title>Example Page</title>
</head>
<body>
<h1>Example HTML Page</h1>
<p>A video of a penguine.</p>
<video>
<source src="/media/video/penguine_1.webm" type="video/webm"/>
<source src="/media/video/penguine_2.mp4" type="video/mp4"/>
</video>
<p>A picture of a penguine.</p>
<picture>
<source srcset="/media/picture/penguine_1.png, penguine_2.png 2x"/>
<img src="/media/picture/penguine_1.png" alt="A photo of a penguine"/>
</picture>
<p>An audio recording of a penguine.</p>
<audio>
<source src="/media/audio/penguine_1.mp3" type="audio/mpeg"/>
<source src="/media/audio/penguine_2.ogg" type="audio/ogg"/>
</audio>
</body>
</html>