HTML5 video has the same syntax, and the same issues, as the <audio> tag: codec support changes in different browsers, and the need for a fallback solution for browsers that do not support the element, such as IE.

The basic structure is the same; the <video> tag can use the same auto play, loop, and preload attributes as the <audio> tag. The only difference is that unlike audio, video has a specific size, and those dimensions should be entered as a style, typically (but not exclusively) inline:

1. <video controls style=“width: 1024px; height: 436px;” >
2. <source src=“sintel.mp4” type=“video/mpeg” />
3. <source src=“sintel.ogv” type=“video/ogg” />
4. </video>

In fact all of CSS, including CSS3 transforms, can be used to style the <video> element.

You can also point the <video> tag to an image that acts as a placeholder for the movie (by default, the <video> tag will only show the first frame of the file as its default, which may well be black, or non-representative of the film as a whole):

1. <video controls placeholder=“assets/images/altanta-placeholder.jpg”
2. style=“width: 1024px; height: 436px;” >
3. <source src=“assets/videos/atlanta.mp4” type=“video/mpeg” />
4. <source src=“ assets/videos/atlanta.ogg” type=“video/ogg” />
5. </video>

To make the video play in browsers that do not recognize the <video> tag, we use a variation on the Flash technique we used with HTML5 audio, as the Flash Player also recognizes .mp4 files:

1. <video controls style=“width: 1024px; height: 436px;” >
2. <source src=“sintel.mp4” type=“video/mpeg” />
3. <source src=“sintel.ogv” type=“video/ogg” />
4. <object type=“application/x-shockwave-flash”
5. data=“player.swf?file=sintel.mp4”>
6. <param name=“movie”value=“player.swf?file=sintel.mp4”/>
7. <a href=“sintel.mp4”>Download the movie</a>
8. </object>
9. </video>