HTML5 <source> Tag
Topic: HTML5 Tags ReferencePrev|Next
Description
The <source> element is used to specify multiple alternative media resources for the media elements like <audio> and <video>.
The following table summarizes the usages context and the version history of this tag.
| Permitted Parent: | A media element, like <audio> or <video> |
|---|---|
| Content: | None. It is an empty element. |
| Start/End Tag: | Start tag: required, End tag: forbidden |
| Version: | New in HTML5 |
Syntax
The basic syntax of the <source> tag is given with:
The example below shows the <source> tag in action.
Example
Try this code »<video controls="controls">
<source src="shuttle.mp4" type="video/mp4">
<source src="shuttle.ogv" type="video/ogg">
Your browser does not support the HTML5 Video element.
</video>Note: The <source> element is commonly used to provide the same media resource in multiple formats supported by different browsers.
Tag-Specific Attributes
The following table shows the attributes that are specific to the <source> tag.
| Attribute | Value | Description |
|---|---|---|
| Required — The following attribute must be specified on this tag for the markup to be valid. | ||
src |
URL | Specifies the URL of the media file. |
| Optional — The following attributes are optional. | ||
media |
media-query | Specifies the type of the media resource i.e. what media or device the file is intended for. See CSS media types for more details. |
type |
media-type | Specifies the media type of the media resource. |
Global Attributes
Like all other HTML tags, the <source> tag supports the global attributes in HTML5.
Event Attributes
The <source> tag also supports the event attributes in HTML5.
Browser Compatibility
The <source> tag is supported in all major modern browsers.
 |
Basic Support—
|
Further Reading
See tutorial on: HTML5 Audio, HTML5 Video.
