HTML | <source> Tag

The <source> tag in HTML is used to attach multimedia files like audio, video and pictures. The <audio>, <video> and <picture> elements contain the <source> element.

Syntax:

<source src="" type=""> 
    // Statements
</source>

Attributes: This tag contains five attributes as mentioned above and described below:

src: It is used to hold the path of media content.
media: It is used to define the type of the media content.
srcset: It is used to specify the URL of image used in different situations.
sizes: It is used to specify the sizes of image in different page layout.
type: It is used to specify the MIME-type resource.

Below examples illustrate the <source> tag in HTML:

Example 1: This example uses <source> tag with the video media file.

html

<!DOCTYPE html>
<html>
 
<head>
    <title>
        HTML source Tag
    </title>
</head>
 
<body>
    <h1 style="color:green;">GeeksforGeeks</h1>
     
    <h2>HTML &lt;source&gt; Tag</h2>
     
    <video width="400" height="350" controls>
        <source src="video.mp4" type="video/mp4">
        <source src="video.ogg" type="video/ogg">
    </video>
</body>
 
</html>                   

Output:

Example 2: This example uses <source> tag with the audio media files.

html

<!DOCTYPE html>
<html>
 
<head>
    <title>
        HTML source Tag
    </title>
</head>
 
<body>
    <h1 style="color:green;">GeeksforGeeks</h1>
     
    <h2>HTML &lt;source&gt; Tag</h2>
     
    <audio controls>
        <source src="audio.mp3" type="audio/mp3">
    </audio>
</body>
 
</html>