How to display audio styles that can be played and paused in html? (code example)-HTML Tutorial-php.cn

How to display audio styles that can be played and paused in html? (code example)

藏色散人

Release： 2018-08-11 10:18:17

Original

3021 people have browsed it

This article mainly introduces you to the specific operation method of displaying audio in html. In this way, for users, the online playback function can greatly improve the efficiency of the site and also bring a certain amount of traffic. Hope it helps friends in need. Here we need to first understand the two important tags in html5.

1. HTML 5 tag, which is a new tag in HTML 5, and this tag must have the src attribute.

2. HTML 5

The controls attribute specifies that the browser should provide playback controls for audio. If this property is set, it specifies that there is no script control set by the author.

htmlThe specific code example for displaying audio is as follows:

<!DOCTYPE HTML>
<html>
<body>
<audio controls="controls">
  <source src="so.ogg" type="audio/ogg">
  <source src="so.mp3" type="audio/mpeg">
  <embed height="100" width="100" src="song.mp3" />
  </audio>
  </body>
  </html>

Copy after login

The above code will display on the page as follows:

How to display audio styles that can be played and paused in html? (code example)

Note:

The numbers in width and height represent the width and height of the player respectively.

src can be modified later to your own music address.

The above is an introduction to the relevant knowledge of how to embed audio in HTML5, which has certain reference value. I hope you will adopt it.

【Recommended related articles】

How to insert audio and video into web pages in html?

How to reload audio/video elements in html5 load()

html5 Stop (pause) the current playback The audio or video method pause()

##Details introduction to the effect of HTML5 using the Audio tag to achieve lyrics synchronization

The above is the detailed content of How to display audio styles that can be played and paused in html? (code example). For more information, please follow other related articles on the PHP Chinese website!