Start learning →

‹ Practice problems Easy HTML and CSS

Add a playable audio file

Let visitors play a recording.

What to build

An audio player.

Requirements

  • An audio element with the controls attribute.
  • A source inside it, with src="talk.mp3" and type="audio/mpeg".
  • A fallback link inside the audio element, going to talk.mp3.

Constraints

Use source, rather than a src on audio.

Example

The fallback only appears in browsers that cannot play the audio.

Why it works

The browser plays the first source it supports, and it shows the fallback only if it cannot.

Hints

Hint 1

Without the controls attribute, there is nothing to press.

Solution

Show one correct solution (try it yourself first)
<h1>Yesterday's talk</h1>
<audio controls>
  <source src="talk.mp3" type="audio/mpeg">
  <a href="talk.mp3">Download the talk</a>
</audio>

Lesson: Audio, video and embedded pages →