Shulou(Shulou.com)06/02 Report--

The main content of this article is to explain "what is the method of playing music with html5 tags". Interested friends may wish to have a look. The method introduced in this paper is simple, fast and practical. Let's let the editor take you to learn "what is the method of playing music with html5 tags"?

Html5 plays music with the "" mark. The audio tag is used to represent audio content in a web document. With this tag, developers can insert a music playback control on the site.

The operating environment of this tutorial: windows7 system, HTML5 version, Dell G3 computer.

Html5 plays music with the "" mark.

Tags: used to represent audio content in a document. With it, you can insert a music player on your personal website and play a song you like.

The usage is simple, like the tag, the attribute src specifies the address of the audio file.

If you just write like this, you won't see anything obvious on the page, and the tags are hidden by default.

For browsers that do not support tags, the text content of the tags will be displayed.

Don't try. It's your browser scum.

To make it easier for us to control the audio file, manipulate its progress, playback pause, volume, and so on, we can add a controls attribute to it:

The usage is the same as the label. For adding the controls attribute, different browsers display different styles of control panels.

(audio control panel of chrome browser)

(audio control panel of firefox browser)

(audio control panel of IE browser)

It depends on which one looks good.

Like labels, tags have a word label:.

Their function and usage are the same, that is, to introduce multiple audio, the browser will choose a supported audio format to load, and for browsers that do not support tags, elements can also be added to the document as content that the browser does not recognize.

Note: the mainstream audio file formats are: mp3, wav, ogg. Different browsers have different support for the three formats. Among them, mp3 format has the best support.

Autoplay attribute: automatically plays after loading. It is also very simple and easy to use.

Loop attribute: as the name implies, it is played in a loop.

Preload property: used to control when audio is loaded.

There are three corresponding values:

None: do not load by default, and then load when necessary.

Metadata: metadata, which is not loaded by default, but the metadata information for this audio can be extracted.

Auto: automatically load, the entire audio is loaded after the web page is loaded.

Muted attribute: mute effect.

With the muted attribute added, the audio has no sound even when it is played, unless the user manually adjusts the volume of the control panel.

At this point, I believe you have a deeper understanding of "what is the method of playing music with html5 tags". You might as well do it in practice. Here is the website, more related content can enter the relevant channels to inquire, follow us, continue to learn!

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.