HTML5 – Embedding multimedia

HTML5 provides a number of elements and attributes for embedding multimedia content such as audio, video, and interactive content in web pages.

The <audio> and <video> elements, which were introduced in HTML5, allow the embedding of audio and video files in web pages. The <source> element is used to specify the source of the audio or video file, and the type attribute is used to specify the MIME type of the file. The controls attribute can be used to display the default audio or video player controls.

Here is an example of how to embed an audio file in HTML5:

<audio controls>
  <source src="audio.mp3" type="audio/mpeg">
  <source src="audio.ogg" type="audio/ogg">
  Your browser does not support the audio element.
</audio>

And here is an example of how to embed a video file in HTML5:

<video controls>
  <source src="video.mp4" type="video/mp4">
  <source src="video.ogg" type="video/ogg">
  Your browser does not support the video element.
</video>

HTML5 also introduced the <iframe> element, which allows the embedding of external content such as web pages, maps, and videos from external sources such as YouTube and Vimeo. The src attribute is used to specify the URL of the external content.

Here is an example of how to embed a YouTube video in an HTML5 page using an <iframe>:

<iframe width="560" height="315" src="https://www.youtube.com/embed/oHg5SJYRHA0" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>

You can customize the appearance and behavior of embedded multimedia content using attributes and JavaScript. You can also style the content using CSS.