HTML and CSS Reference
Common attributes: controls, autoplay, loop, and preload
The <audio> element has several attributes that control its behavior,
including src and controls , which you saw in the simple example. It's
possible to add the element with no attributes at all:
Hey! Where is it?!!
The screenshot isn't interesting because there's nothing to see—with-
out the controls attribute, the element isn't visible on the page. Having
no visible controls means you have to start the audio playing by other
means—either by using the autoplay attribute (discussed in a moment)
or by providing your own controls (which you'll learn about in the sec-
tion “The <video> element”).
Adding the controls attribute means the <audio> element has visible
The preload attribute lets you hint to the browser whether a file is likely
to be needed, so you can avoid excessive server load:
<audio src="myaudio.ogg" controls preload="metadata">
It can take the following values:
none —You don't believe the audio resource is likely to be used.
metadata —You don't believe the audio is likely to be used, but the
browser should fetch information such as the dimensions, first
frame, and duration.