Multimedia

Audio, Video, and iframes

Integrating media playback and embedding nested browsing contexts.

HTML5 introduced native media tags like <audio> and <video> to make media integration simpler. External resources can be embedded via <iframe>.

Multimedia Elements

  • <video>: Embeds video content. Include controls to show default play/pause buttons.
  • <audio>: Embeds audio tracks.
  • <source>: Declares multiple alternative formats (e.g. mp4, webm, ogg) for the browser to choose from.
  • <iframe>: Inline frame. Embeds another HTML document inside the current page.

Example

html
<video controls>

<source src="movie.mp4">

</video>

Interview questions

Sign in to save

What is the purpose of the <source> tag inside a <video> element?

It lets you define multiple media file options in different formats. The browser will automatically scan the list and load the first file format it natively supports, ensuring maximum compatibility across different browsers.

Practice

Write code to embed a responsive YouTube video frame (iframe) or custom video player.

Hint: Set <iframe src='video_url' width='100%' height='315' frameborder='0'></iframe>.