How to play music in the music playing interface of web page design and production

To design and make a music playing interface, you need to insert the audio tag of HTML5 into the page to play music.

tools/materials:

ASUS DN2

win1

browser 1.26

1. Open the commonly used web design software first, and then create a new web file.

2. Make a simple page layout so that the music player can be displayed in the middle of the webpage. And add simple styles.

< style type="text/css">

#music_player{width:4px; height:15px; background:#ff9966; margin:2px auto; }

< /style>

< div? id="music_player"? class=""> < /div>

3. Preview the process in the browser to see if the location is appropriate.

4. use the audio tag of HTML5 to set the music player.

< div id="music_player" class="">

< audio controls>

< Source src="D:\KuGou\ goshawk-worship the Qin tombs.mp3 "type =" audio/mpeg ">

< /audio>

< /div>

5. after the player is set up, we can insert the address of the song in < source src = "song address" > and play it automatically. For example:

<; audio controls>

< Source src="D:\KuGou\ goshawk-worship the Qin tombs.mp3 "type =" audio/mpeg ">

< /audio>

6. When the browser browses, you can find that the music starts after clicking Play.