Course Content
Ultimate HTML
Ultimate HTML
Audio and Video Embedding
Audio Embedding
To include audio files on a web page, we can utilize the <audio>
element. Let's consider an example:
index
index
index
In this example we have.
<audio>
element contains a<source>
element, which specifies the URL and file type of the audio file. Commonly supported formats are MP3 and OGG;controls
attribute displays standard playback controls such as play, pause, and volume;- If the user's browser doesn't support the audio element, a fallback message will be displayed.
Additional attributes commonly used with the HTML audio element include:
autoplay
- starts playing the audio file as soon as the page loads;loop
- causes the audio file to loop continuously;muted
- mutes the audio by default;volume
- specifies the default volume level for the audio file, ranging from 0.0 (silent) to 1.0 (full volume).
Here's an example demonstrating the usage of all these attributes:
index
index
index
Video Embedding
We can use the <video>
element to embed video files on a web page. Consider the following example:
index
index
index
In this example:
<video>
element contains a<source>
element, which specifies the URL and file type of the video file. Commonly supported formats are WebM, MP4, and OGG;controls
attribute displays standard playback controls;- If the user's browser doesn't support the video element, a fallback message will be displayed.
Commonly used attributes for the HTML video element include:
autoplay
- starts playing the video file as soon as the page loads;loop
- causes the video file to loop continuously;muted
- mutes the audio by default;volume
- specifies the default volume level for the audio file, ranging from 0.0 (silent) to 1.0 (full volume);poster
- specifies the URL of an image to display as the video thumbnail before the video is played;width
andheight
- specifies the width and height of the video player in pixels.
Here's an example demonstrating the usage of all these attributes:
index
index
index
Note
Additionally, there are many JavaScript libraries and APIs available that provide additional functionality for playing and manipulating video content on the web.
Everything was clear?