Background Music HTML Autoplay Hidden
Last Updated : Mar 11, 2024
IN - HTML | Written & Updated By - Pragati
In this tutorial we will show you the solution of background music HTML autoplay hidden, in HTML as you see we already publish some articles on audio or music files like how to embed music files in html and make them autoplay, etc.
Today, our articles is also on audio/music files and that is on background music in html and autoplay.
So, in this article we will tell you how you are able to play music in background and also with autoplay mode. Let us understand the article.
Step By Step Guide On Background Music HTML Autoplay Hidden :-
Now, as we know that there are many ways with the help of which you are able to add music in background.
We already in our previous articles specified the use of audio and embed tag in which we insert some audio files.
Now, let us understand how to make this music as background music with help of autoplay. Here, below the codes are given in which we will show you example.
<!DOCTYPE html> <html> <head> <title> Title of the document<title> </head> <body> <embed src="Adore.mp3" loop="true" autostart="true" width="2" height="0" hidden> <audio controls autoplay hidden> <source src="Adore.mp3" type="audio/mpeg"> Your browser does not support the audio element. </audio> </body> </html>
- First, we write <! DOCTYPE html> which we used as an instruction to the web browser about what version of HTML file is written in.
- Secondly, the <html> tag is used to indicate the beginning of an HTML document.
- As above now <head> tag is used to contain information about web page. In this tag a <title> tag is used which helps us to specify a webpage title. Both <head> and <title> tags are Paired tags. So, both have </head> and </title> ending tags respectively.
- Thirdly, <body> tag is used to define the webpage body. All the contents to show on website are written here.
- Here, we show you an example of insert audio files. For reference we use here two tags. The first one used here is embed tag whereas the other one is audio tag. Let us understand both of them one by one.
- In first, that is embed tag. Here we all know embed tag is singular tag, so it only has only opening tag. After the attribute for background play is used hidden and for autoplay we use autostart. The hidden attribute hide embed tag, whereas autostart help to start playing music after loading of page.
- The next tag used here is audio tag. And in this we use source attribute. The attribute used in source is src in which we give location of file having .mp3 that we want to play. Where in audio tag, attributes like controls, autoplay and hidden are used. These do as same job as doing in embed tag.
- At last, the <body> and <html> tags are closed with </body> and </html> respectively.
Conclusion :-
In conclusion, here, we can say that now you are able to play background music in html with the property of autoplay.
You can use any one from them to done your work. I hope this tutorial on background music HTML autoplay hidden helps you.
About Pragati
