You are on page 1of 2

The media attribute specifies what media/device the linked document is optimized for.

This attribute is used to specify that the target URL is designed for special devices (like
iPhone), speech, or print media. This attribute can accept several values. They are only
used if the href attribute is present.

Videos:

Adding video in HTML5 is very similar to adding audio. We use the <video> element in
place of the <audio> element—all of the same attributes (src, autoplay, controls, loop,
and preload.
<video src="earth.ogv" controls></video>

The HTML <video> element is used to show a video on a web page.


<video width="320" height="240" controls>
<source src="movie.mp4" type="video/mp4">
<source src="movie.ogg" type="video/ogg">
Your browser does not support the video tag.
</video>

The controls attribute adds video controls, like play, pause, and volume.
It is a good idea always to include width and height attributes. If height and width are
not set, the page might flicker while the video loads.
The <source> element allows you to specify alternative video files that the browser may
choose from. The browser will use the first recognized format.
The text between the <video> and </video> tags will only be displayed in browsers that
do not support the <video> element.
One additional attribute available for the <video> element is the poster attribute.
The poster attribute allows us to specify an image, in the form of a URL, to be shown
before a video is played. The example below uses a screen capture from the video as
the poster for the Earth video.

<video src="earth.ogv" controls poster="earth-video-screenshot.jpg"></video>

References
Adding Media. (n.d.). Retrieved from Learn to Code HTML & CSS:
https://learn.shayhowe.com/html-css/adding-media/

1|Media Files in HTML


How to Embed PDF in HTML. (n.d.). Retrieved from W3 Docs:
https://www.w3docs.com/snippets/html/how-to-embed-pdf-in-html.html

2|Media Files in HTML

You might also like