Home >Web Front-end >H5 Tutorial >What does the html5 track tag mean? Introduction to how to use the html5 track tag

What does the html5 track tag mean? Introduction to how to use the html5 track tag

寻∝梦
寻∝梦Original
2018-08-23 17:40:515724browse

This article introduces the definition of the html5 track tag and how to use it, as well as some descriptions of the optional attributes of the html5 track tag. I hope everyone can read this article carefully.

html5 The definition and usage of the track tag:

9bf7cbf2c39baa37076a22499de2f6ed The tag specifies an external text track for media such as video elements.

is used to specify subtitle files or other files containing text that are visible when the media is played.

html59bf7cbf2c39baa37076a22499de2f6ed Tag optional attributes:

  • default: default track. (value: default). The default attribute is used to notify the browser that the current track file can be used when the user does not choose to use other subtitle files.

  • kind: the text type of the text track (values: captions, chapters, descriptions, metadata, subtitles). The kind attribute is used to specify the type of subtitle file (that is, a file used to store subtitles, chapter titles, description text, or metadata). The attribute values ​​that can be specified for the kind attribute are subtitles, captions, descriptions, chapters and metadata

  • label: the label and title of the text track (value: text).

  • src: URL of the track file, required attribute (value: URL). The src attribute is used to specify the storage path of the subtitle file. This attribute is a must-use attribute. The attribute value of the src attribute can be an absolute URL path or a relative URL path.

  • srclang: Language for track text data. (value: language_code ). The srclang attribute is used to specify the language of the subtitle file. For example, srclang="en" and srclang="zh-cn" indicate that the subtitle file is English and Chinese respectively.

9bf7cbf2c39baa37076a22499de2f6ed tag supports html global attributes and html event attributes

html5 track tag format:

<track src="URL">

HTML5 9bf7cbf2c39baa37076a22499de2f6ed tag example

Video with two subtitle tracks:

<video width="320" height="240" controls>
<source src="forrest_gump.mp4" type="video/mp4">
<source src="forrest_gump.ogg" type="video/ogg">
<track src="subtitles_en.vtt" kind="subtitles" srclang="en"
label="English">
<track src="subtitles_no.vtt" kind="subtitles" srclang="no"
label="Norwegian">
</video>

Track object in html5

Track object is HTML5 Newly added.

The Track object represents the HTML5 9bf7cbf2c39baa37076a22499de2f6ed element.

Accessing the Track object in html5

You can access the 9bf7cbf2c39baa37076a22499de2f6ed element by using getElementById():

var x = document.getElementById("myTrack");

Creating the Track object in html5

You can use the document.createElement() method to create the 9bf7cbf2c39baa37076a22499de2f6ed element:

var x = document.createElement("TRACK");

html5 Introduction to how to use the track tag:

track Elements can add text information such as subtitles, titles, or chapters to videos played using the video element or audio played using the audio element. The process of adding subtitles to video using the track element is the same as adding subtitles to audio. The track element is a child element of the video element, and the 9bf7cbf2c39baa37076a22499de2f6ed tag must be written between the start tag and the end tag of the video element. If the e02da388656c3265154666b7c71a8ddc tag is used to describe a media file, the 9bf7cbf2c39baa37076a22499de2f6ed tag must be written after the e02da388656c3265154666b7c71a8ddc tag. The track element is an empty element that does not contain any content between its start tag and end tag.

Browser support

Internet Explorer 10, Chrome and Opera support the 9bf7cbf2c39baa37076a22499de2f6ed tag.

Differences between HTML 4.01 and HTML 5

The9bf7cbf2c39baa37076a22499de2f6ed tag is a new tag in HTML 5.

【Editor’s Recommendations】

html Detailed explanation of the usage of include tag (with usage examples)

html5 table Introduction to label style (attached is an example of html5 table css centering)

The above is the detailed content of What does the html5 track tag mean? Introduction to how to use the html5 track tag. For more information, please follow other related articles on the PHP Chinese website!

Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn

Related articles

See more