How to use html5 source tag? Introduction to html5 source tag attributes

html5 How to use source tag? Introduction to html5 source tag attributes. Now let’s introduce the content of this article, mainly telling you about the use of html5 source tags and a detailed introduction to the three attributes of html5 source tags

html5 source tag definition and usage:

The tag defines media resources for media elements such as

tag allows you to specify alternative video/audio files for the browser to select based on its support for media types or codecs.

HTML5 tag example:

Audio player with two source files. The browser should select the files it supports (if any):

<audio controls>
   <source src="horse.ogg" type="audio/ogg">
   <source src="horse.mp3" type="audio/mpeg">
 Your browser does not support the audio element.
</audio>

Tag basic attributes:

• media : The type of media resource for the browser to decide whether to download (value: media_query).

• src: URL of the media file (value: URL).

• type: The MIME type of the media resource (value: MIME_type).

Note: The tag supports html global attributes and html event attributes

html5 source tag format:

<source src="媒体资源地址" />

HTML5media attribute:

Use media attribute:

<source src="movie.ogg" type="video/ogg" media="screen and (min-width:320px)">

HTML5media attribute definition and usage:

The media attribute specifies the type of media resource (what media/device the file is optimized for).

The browser can use this attribute to determine whether it can play the file. If you can't play it, you can choose not to download it.

Note: This attribute can accept multiple values.

HTML5media attribute syntax:

<source media="value">

Note: Because any browser does not support the media attribute of the tag. So I won’t say much more.

HTML5src attribute:

The definition and usage of HTML5src attribute:

src attribute Specifies the URL of the media file to be played.

HTML5src attribute syntax:

<source src="URL">

HTML5src attribute usage example:

Audio player with two resource files. The browser should choose which file it supports (if any):

<audio controls>
   <source src="horse.ogg" type="audio/ogg">
   <source src="horse.mp3" type="audio/mpeg">
 Your browser does not support the audio element.
</audio>

Attribute value of HTML5src attribute:

HTML5type attribute:

HTML5The definition and usage of the type attribute:

The type attribute specifies the media The MIME type of the resource.

Usage of type attribute:

<audio controls>
<source src="horse.ogg" type="audio/ogg">
<source src="horse.mp3" type="audio/mpeg">
您的浏览器不支持 audio 元素。
</audio>

HTML5Syntax of type attribute:

<source type="MIME_type">

HTML5type attribute Attribute value:

Differences between HTML 4.01 and HTML 5

The tag is a new tag in HTML 5.

Browser support:

Internet Explorer 9, Firefox, Opera, Chrome and Safari support the tag.

Note: Internet Explorer 8 and earlier versions do not support the tag.

【Related Recommendations】

html What is the role of the meta tag? Introduction to common attributes of html meta tags

What is the html map tag? Detailed explanation of the structure and specific usage of the html map tag

The above is the detailed content of How to use html5 source tag? Introduction to html5 source tag attributes. For more information, please follow other related articles on the PHP Chinese website!