0% found this document useful (0 votes)
3 views2 pages

3563 (1)

Hknjn

Uploaded by

harshitmishra408
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
3 views2 pages

3563 (1)

Hknjn

Uploaded by

harshitmishra408
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 2

HTML MEDIA (AUDIO AND VIDEO)

HTML5 features include native audio and video support without the need for Flash.
The HTML5 <audio> and <video> tags make it simple to add media to a website. You need to set src
attribute to identify the media source and include a controls attribute so the user can play and pause the
media.

Embedding Video
Here is the simplest form of embedding a video file in your webpage −
<video src = "foo.mp4" width = "300" height = "200" controls>
Your browser does not support the <video> element.
</video>
The current HTML5 draft specification does not specify which video formats browsers should support in
the video tag. But most commonly used video formats are −

 Ogg − Ogg files with Thedora video codec and Vorbis audio codec.
 mpeg4 − MPEG4 files with H.264 video codec and AAC audio codec.
You can use <source> tag to specify media along with media type and many other attributes. A
video element allows multiple source elements and browser will use the first recognized format −
<!DOCTYPE HTML>
<html>
<body>

<video width = "300" height = "200" controls autoplay>


<source src = "/html5/foo.ogg" type ="video/ogg" />
<source src = "/html5/foo.mp4" type = "video/mp4" />
Your browser does not support the <video> element.
</video>

</body>
</html>
Video Attribute Specification
The HTML5 video tag can have a number of attributes to control the look and feel and various
functionalities of the control −
Sr.No. Attribute & Description
autoplay
1 This Boolean attribute if specified, the video will automatically begin to play back as soon as
it can do so without stopping to finish loading the data.
autobuffer
2 This Boolean attribute if specified, the video will automatically begin buffering even if it's
not set to automatically play.
3 controls
If this attribute is present, it will allow the user to control video playback, including volume,
seeking, and pause/resume playback.
height
4
This attribute specifies the height of the video's display area, in CSS pixels.
loop
5 This Boolean attribute if specified, will allow video automatically seek back to the start after
reaching at the end.
preload
6 This attribute specifies that the video will be loaded at page load, and ready to run. Ignored
if autoplay is present.
poster
7
This is a URL of an image to show until the user plays or seeks.
src
8 The URL of the video to embed. This is optional; you may instead use the <source> element
within the video block to specify the video to embed.
width
9
This attribute specifies the width of the video's display area, in CSS pixels.

Embedding Audio
HTML5 supports <audio> tag which is used to embed sound content in an HTML or XHTML document as
follows.
<audio src = "foo.wav" controls autoplay>
Your browser does not support the <audio> element.
</audio>
The current HTML5 draft specification does not specify which audio formats browsers should support in
the audio tag. But most commonly used audio formats are ogg, mp3 and wav.

You might also like