HTML Audio & Video

Audio & Video Examples

Audio Player Example:

Responsive Video Player with Subtitles:

Sample Video with Subtitles

Example Code

<audio controls>
  <source src="https://www.w3schools.com/html/horse.mp3" type="audio/mpeg">
  Your browser does not support the audio element.
</audio>

<figure>
  <video controls>
    <source src="https://www.w3schools.com/html/mov_bbb.mp4" type="video/mp4">
    <track src="https://www.w3schools.com/subtitles.srt" kind="subtitles" srclang="en" label="English">
    Your browser does not support the video element.
  </video>
  <figcaption>Sample Video with Subtitles</figcaption>
</figure>

HTML Tags & Attributes Explanation

<audio>

Embeds an audio player supporting MP3 or WAV formats. Multiple <source> elements can be used.

<video>

Embeds a video player with optional subtitles, captions, or multiple formats.

<source>

Specifies media resources for <audio> or <video> allowing browser format selection.

<track>

Specifies text tracks like subtitles or captions for media elements.

<figure>

Groups media content with an optional caption for semantic meaning.

<figcaption>

Provides a caption for content inside a <figure>.

Attributes

src: Media file path. type: MIME type. kind: Track type. srclang: Track language. label: Track name. controls: Adds playback UI.