All TalkersCode Topics

Follow TalkersCode On Social Media - A Social Media Network for developers Join Now ➔

How To Insert Audio Into HTML

Last Updated : Mar 11, 2024

How To Insert Audio Into HTML

In this article we will show you the solution of how to insert audio into HTML, play, stop, and volume controls for music are now added thanks to the controls attribute.

You can supply other audio files that the browser may select from by using the <source> element. The first format that the browser recognizes will be used.

Since HTML5's launch, audio can be included on websites by utilizing the "audio" tag.

Before, only internet plugins like Flash could play audio files on web pages. An inline element called "audio" is used to insert sound files into web pages.

The following list includes the many properties that are compatible with the "audio" tag:

  • Controls: Choose which controls will be visible alongside the audio player.
  • Autoplay: Indicates that the audio file will start playing as soon as the controls have loaded.
  • Loop: Indicates that the audio file should keep playing constantly.
  • src: Specifies the audio file's URL.
  • indicates that the audio file must be muted (muted).

When defining sounds like music or other audio clips, HTML audio tags are used. There are three file formats that the Html5 web audio tag currently supports.

mp3 \swav \song

Controls for video and audio are supported by HTML5. The multimedia files are played using Flash, Silverlight, and other comparable technologies.

This table shows which web browsers support which audio file formats. To include audio files on a web page, use the HTML <audio> tag.

It makes it possible to play audio files directly inside a web browser with no need for additional plugins.

Step By Step Guide On How To Insert Audio Into HTML :-

    <title>Audio in HTML</title>
    <audio src="myAudio.mp3"></audio>
  1. The browser is informed of the HTML version we are using in our first line, which is <HTML>. Tags are the foundation of HTML documents. Following the title tag in the <head> tag, the script tag must be entered between the opening and closing brackets. Then enter the JavaScript function.
  2. Next comes the body tag, which defines the body of the webpage. You can create this same content for your site in one specific location.
  3. Then we create audio src as an mp3 format.
  4. Finally, after closing all tags, </body></html> but also code should be executed.

Conclusion :-

As a result, we have successfully learned how to insert audio into HTML.

An inline element called "audio" allows you to include sound files on a website.

Developers can use this tag to add audio files, such as songs, music, etc. to their websites.

HTML developers should use specified codes to encode an audio file since not every web browser supports all audio formats.

To show different interpretations of a single audio file, they may utilize a <source> tag and the src property.

I hope this article on how to insert audio into HTML helps you and the steps and method mentioned above are easy to follow and implement.

Author Image About Pragati

Experienced coding content writer who enjoys breaking down complex concepts in programming languages like Java, Python, C, and C++. Over three years of experience producing interesting and relevant content for a variety of entities. Committed to providing concise and easy-to-understand articles that assist readers in easily understanding technology and industry trends in the world of coding and software development.

Follow Pragati On Linkedin 🡪