<track>

HTML <track> Tag

The <track> tag is one of the HTML5 elements. It defines subtitles, captions, descriptions, chapters, or metadata for either a <audio> or <video> media element.

The data type is set in the kind attribute. The element points to the source code which contains a timed text displayed by the browser when the user requests some additional data.

A media element cannot have more than one track having the same label, srclang, and kind.

Syntax

Syntax

The <track> tag is empty, which means that the closing tag isn’t required. But in XHTML, the (<track>) tag must be closed (<track/>).

<[audio | video]>
  ...
   <track src="...">
  ...
</[audio | video]>

Example of the HTML <track> tag:

<!DOCTYPE html>
<html>
  <head>
    <title>Title of the document</title>
    <style>
      video {
        width: 300px; 
        height: 200px;
        border: 1px solid #666;
      }
    </style>
  </head>
  <body>
    <video controls muted src="/build/videos/arcnet.io(7-sec).mp4">
      <track default kind="subtitles" srclang="en" src="/build/videos/arcnet.io(7-sec).mp4"/>
    </video>
    <p>Some information about video</p>
  </body>
</html>

Attributes

Attributes

AttributeValueDescription
defaultdefaultSpecifies that the track should be enabled unless the user’s preferences indicate that another track is more appropriate. This is used on one track element per media element.
kindDefines the kind of text track.
captionsSpecifies the translation of dialogue and sound effects.
chaptersSpecifies chapter titles for better navigation.
descriptionsSpecifies a textual description of the video content.
metadataSpecifies the content used by scripts (not visible for the user).
subtitlesSpecifies subtitles in a video.
labeltextSpecifies a user-readable title of the text track.
srcURLSets the path of the track.
srclanglanguage_codeSets the language of the track text data (must be defined if kind = “subtitles”).

The <track> tag also supports the Global attributes and the Event Attributes.



请遵守《互联网环境法规》文明发言,欢迎讨论问题
扫码反馈

扫一扫,反馈当前页面

咨询反馈
扫码关注
返回顶部