Open In App
Related Articles

HTML | <source> Tag

Improve Article
Improve
Save Article
Save
Like Article
Like

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>

Output:

  

Supported Browsers: The browsers supported by HTML <source> Tag are listed below:

  • Google Chrome 
  • Edge 12
  • Internet Explorer 9.0
  • Firefox 3.5
  • Safari 
  • Opera 

Last Updated : 19 Jul, 2022
Like Article
Save Article
Similar Reads
Related Tutorials