|src||Source of the video.|
|width and height||Size of the video.
If unspecified, the default width and height of the video will be used. If you specify one dimension but not the other, the browser will adjust the size of the unspecified dimension to preserve the aspect ratio of the video.
|controls||If this boolean attribute is present, the browser displays its own controls for video playback and volume.|
|poster||This attribute allows you to specify an image that the browser will use while video is being downloaded, or until the user starts playing the video.
If this attribute is not specified, the first frame of the video will be used instead.
|autoplay||This attribute asks the browser to start playing the video automatically as soon as the page is ready.|
|preload||The preload attribute is used when autoplay is not used. It tells the browser what to do before a user plays a video. This attribute is a hint – the browser may ignore it. While autoplay and preload are mutually exclusive, if both are present, then preload is ignored.
|loop||Another boolean attribute that indicates to play the video in loop mode (and it starts again when finished).|
ATTRIBUTES OF THE <AUDIO> ELEMENT
The attributes you can use with the <audio> element are a subset of those available for the <video> element. Except for the poster attribute, they are all recognized and have the expected meanings:
- src: source of an audio stream.
- controls: if this attribute is present, the browser displays its own controls for audio playback and volume.
- autoplay: tells the browser to start playing the audio stream automatically as soon as the page is ready – please read details in the above table.
- preload: tells the browser what to do before a user plays a sound – please read details in the above table.
- loop: indicates to play the audio stream in loop mode (start again when finished).
As with the <video> element, the same best practice in regard to preload and autoplay attributes should be followed.
Best practice: do not use autoplay and add preload=”none” if you target mobile devices or if you have multiple audio/video on the same page. For example, this page contains many audio elements and it does not make sense to have them preload or autoplay.