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.
- type: 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.
<!DOCTYPE html> <html> <head> <title> HTML source Tag </title> </head> <body> <h1 style="color:green;">GeeksforGeeks</h1> <h2>HTML <source> 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> |
chevron_right
filter_none
Output:
Example 2: This example uses <source> tag with the audio media files.
<!DOCTYPE html> <html> <head> <title> HTML source Tag </title> </head> <body> <h1 style="color:green;">GeeksforGeeks</h1> <h2>HTML <source> Tag</h2> <audio controls> <source src="audio.mp3" type="audio/mp3"> </audio> </body> </html> |
chevron_right
filter_none
Output:
Supported Browsers: The browsers supported by HTML <source> Tag are listed below:
- Google Chrome 4.0
- Internet Explorer 9.0
- Firefox 3.5
- Safari 4.0
- Opera 10.5
Recommended Posts:
If you like GeeksforGeeks and would like to contribute, you can also write an article using contribute.geeksforgeeks.org or mail your article to contribute@geeksforgeeks.org. See your article appearing on the GeeksforGeeks main page and help other Geeks.
Please Improve this article if you find anything incorrect by clicking on the "Improve Article" button below.
