PUBLISHED ON: FEBRUARY 22, 2021
HTML Track Tag
In HTML, the <track>
tag is used as a child of <video>
and <audio>
tags.
-
The <track>
tag allows us to specify timed tracks Like for example, it allows you to automatically handle subtitles.
-
Whenever we play a video then we see subtitles or captions on video these are possible with the help of this <track>
tag.
-
It is an empty element.
HTML <track>
Tag Syntax and Usage
As <track>
is an empty element; so it requires start tag only and it does not require an end tag.
Following is the syntax for using the track tag in your HTML code:
<track attribute_name=" ">
HTML <track> tag Attributes
The <track>
tag supports both global and event attributes and some of the common attributes are given below.
1. Default
The default attribute is used to indicate that the track should be enabled until and unless the user's preference indicate that the track is more important.
2. Label
The label attribute of the title track is a user-readable title of text track which is used at the time of listing the available text tracks by the browser
3. Src
The src attribute is used to specify the URL and the origin of the document and URL should be the same.
4. Srclang
This attribute specifies the language of the track text data.
5. Kind
This attribute is used to specify the kind of text track.Its possible values are:- descriptions ,captions,chapters ,metadata.
HTML <track>
Tag Basic Example
Below we have a basic example showing how we use the HTML track tag
<video controls width="250"
src="/media/examples/abc.mp4">
<track default kind="captions"
srclang="en"
src="/media/examples/abc.vtt"/>
Sorry, your browser doesn't support embedded videos.
</video>
Browser Support for HTML <track>
Tag
Following browsers support this attribute:
-
Google Chrome 23.0+
-
Internet Explorer 10.0
-
Firefox 31.0
-
Opera 12.1+
-
Safari 6.0