What does the HTML5 track label mean? Introduction to how to use HTML5 track tags

Source: Internet
Author: User
Tags opening and closing tags
This article introduces the definition of HTML5 track label and how to use it, as well as some descriptions of the optional properties of the HTML5 track tag, and I hope everyone can read this article carefully.

HTML5 track label definition and usage:

<track> tags Specify external text tracks for media such as video elements.

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

Html5<track> Optional Properties for tags:

    • Default: Defaults to the track. (value: Default). The default property is used to inform the browser that the current track file can be used when the user has not chosen to use another subtitle file

    • Kind: Text type of text track (value: Captions, chapters, descriptions, metadata, subtitles). The kind property is used to specify the kind of caption file (that is, the file used to hold captions, chapter headings, descriptive text, or metadata). The property values you can specify for the kind property are subtitles, captions, descriptions, chapters, and metadata

    • SRC: URL of the track file, required attribute (value: URL). The SRC attribute is used to specify the location path of the caption file, which is a property that must be used. The attribute value of the SRC attribute can be either an absolute URL path or a relative URL path.

    • Srclang: The language of the track text data. (Value: Language_code). The Srclang property is used to specify the language of the caption file. For example, srclang= "en" and srclang= "ZH-CN" respectively indicate that subtitle files are in English and Chinese.

<track> tags support HTML global properties and HTML event properties

HTML5 track label Format:

<track src= "URL" >

HTML5 <track> Tag Examples

Video with two subtitle tracks:

<video width= "" "height=" 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= " 中文版 "><track src=" SUBTITLES_NO.VTT "kind=" subtitles "srclang=" no "label=" Norwegian "></video>

Track objects in the HTML5

The track object is HTML5 new.

The track object represents the HTML5 <track> element.

Accessing track objects in the HTML5

You can access the <track> elements by using getElementById ():

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

Create a track object in a HTML5

You can use the Document.createelement () method to create a <track> element:

var x = document.createelement ("track");

How to use HTML5 track Tags:

The track element can add text messages, such as captions, titles, or chapters, to videos played using the video element or audio that is played using the music element. Track elements the process of adding captions to a video and the process of adding captions to audio are the same. The track element is a child of the video element,<track> tag must be written between the opening and closing tags of the video element. If you use the <source> tag to describe the media file, the <track> tag must be written after the <source> tag. The track element is an empty element with no content between the opening and closing tags.

Browser support

Internet Explorer, Chrome and Opera support <track> tags.

Differences between HTML 4.01 and HTML 5

The <track> tag is a new label in HTML 5.

"Good for a short stay"

An explanation of the use of HTML include tags (with usage examples)

HTML5 table Label Style introduction (also attached HTML5 table CSS Center instance)

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.