HTML and CSS Reference
In-Depth Information
Figure 9.8 Our Styles Conference Speakers page after adding images for each of the
Adding Audio
HTML5 provides a quick and easy way to add audio files to a website by way of the <au-
dio> element. As with the <img> element, the <audio> element accepts a source URL
specified by the src attribute. Unlike the <img> element, though, the <audio> element
requires both opening and closing tags, which we'll discuss soon.
Click here to view code image
1. <audio src="jazz.ogg"></audio>
Audio Attributes
Several other attributes may accompany the src attribute on the <audio> element; the
most popular include autoplay , controls , loop , and preload .
The autoplay , controls , and loop attributes are all Boolean attributes. As Boolean
attributes, they don't require a stated value. Instead, when each is present on the <audio>
element its value will be set to true , and the <audio> element will behave accordingly.
By default, the <audio> element isn't displayed on a page. If the autoplay Boolean at-
tribute is present on the <audio> element, nothing will appear on the page, but the audio
file will automatically play upon loading.
Click here to view code image
1. <audio src="jazz.ogg" autoplay></audio>
To display the <audio> element on a page, the controls Boolean attribute is necessary.
When it's applied to the <audio> element, the controls Boolean attribute will display
a browser's default audio controls, including play and pause, seek, and volume controls
(see Figure 9.9 ) .
Click here to view code image
1. <audio src="jazz.ogg" controls></audio>
Figure 9.9 An audio clip with the default Google Chrome browser controls
Search WWH ::

Custom Search