HTML and CSS Reference
In-Depth Information
CHAPTER 5
Native Video
Emily Lewis
5.0 Introduction
HTML5's new embedded content elements offer designers and developers more
options for including media in our sites.
Similar in nature to
audio
, the
video
element shares many of the same attributes, has a
similar syntax, and can be styled and manipulated with CSS and JavaScript. And just
like
audio
,
video
has some implementation challenges.
5.1 Adding HTML5 Video
Problem
You want to play native video on your web page.
Solution
Use the
video
element with the addition of a
src
attribute that references the location
of your video file:
<video
src="video.ogv"
></video>
To display default video player controls (see
Figure 5-1
), add the Boolean
controls
attribute:
<video src="video.ogv"
controls
></video>
Native player controls look different in different browsers. Style your
own controls with JavaScript and CSS (see
Recipe 5.6
).
