HTML | kind Attribute
Last Updated :
19 Jul, 2022
The HTML <track> kind Attribute is used to specify the kind of the track for video and audio files. This is very useful if the listener or viewer is deaf.
Syntax:
<track src="subtitles_en.vtt" kind="subtitles" srclang="en">
Attribute Value: It is either true or false which shows the default state of the track. By default, it is false.
- captions: It defines translation of dialogue and sound effects which is also suitable for deaf users.
- metadata: It states content used by scripts but is not shown to users.
- chapters: It defines chapter titles which is suitable to navigate the media resource.
- subtitles: Display subtitles in a video and audio.
- descriptions: It describes the textual description of the video or audio content.
Example 1: This example illustrates the <track> kind attribute with video element.
HTML
<!DOCTYPE html>
<html>
<head>
<title>
HTML track kind Attribute
</title>
<style>
body {
text-align: center;
}
h1 {
color: green;
}
</style>
</head>
<body>
<h1>GeeksforGeeks</h1>
<h2>HTML track kind Attribute</h2>
<video width="420" height="240" controls>
<source src="video1" type="video/mp4">
<track src="subtitles_en.vtt" kind="subtitles"
srclang="en" label="English">
</video>
</body>
</html>
|
Output:
Example 2:This example illustrates the use of <track> kind attribute with audio element.
HTML
<!DOCTYPE html>
<html>
<head>
<title>
HTML track kind Attribute
</title>
<style>
body {
text-align: center;
}
h1 {
color: green;
}
</style>
</head>
<body>
<h1>GeeksforGeeks</h1>
<h2>HTML track kind Attribute</h2>
<audio controls>
<source src="audiofile_name" type="audio/mp3">
<track src="subtitles_en.vtt" kind="subtitles"
srclang="en" label="English">
</audio>
</body>
</html>
|
Output:
Supported Browsers: The browser supported by HTML <track> kind Attribute are listed below:
- Google Chrome 23.0
- Edge 12.0
- Internet Explorer 10.0
- Mozilla Firefox 31.0
- Safari 6.0
- Opera 12.1
Like Article
Suggest improvement
Share your thoughts in the comments
Please Login to comment...