The <track> tag in HTML is used to specify text tracks for <video> and <audio> elements. It provides subtitles, captions, or other kinds of text metadata synchronized with the media.
Note:
- The
<track>tag supports the Global Attributes and Event Attributes in HTML. - Tracks are formatted in WebVTT format (.vtt files).
<!DOCTYPE html>
<html>
<body>
<video width="600" height="400" controls>
<source src=
"https://media.geeksforgeeks.org/wp-content/uploads/20231212135336/animationgif.mp4" type="video/mp4">
<track src=
"https://media.geeksforgeeks.org/wp-content/uploads/20231212135336/animationgif.vtt" kind="subtitles"
srclang="en" label="English">
</video>
</body>
</html>
Syntax
<track attribute>Attributes
Attribute Values | Description |
|---|---|
default | Specifies that, the track to enabled if the user wants to change the track. |
kind | Specifies the kind of text track |
label | The title of the text track |
src | It is for the URL of the track file |
srclang | It tells the language of the track text data (required if kind="subtitles") |
Example 2:
<!DOCTYPE html>
<html lang="en">
<body>
<video width="700" height="500" controls>
<source src="https://media.geeksforgeeks.org/wp-content/uploads/20231214153822/1.mp4" type="video/mp4">
<track src="https://media.geeksforgeeks.org/wp-content/uploads/20231212135336/animationgif.vtt"
kind="subtitles" srclang="en" label="English" default>
</video>
</body>
</html>