HTML and CSS Reference
5.4 Displaying a Placeholder Image Before Video Plays
You want to display a still frame, or poster image, before the user starts the video.
Add the poster attribute with the placeholder image file path as the value:
<video controls width="640" height="360" poster="video_still.png" >
<source src="video.mp4" type="video/mp4" />
<source src="video.ogv" type="video/ogg" />
Your device does not support HTML5 video.
Poster images can be a nice user enhancement, especially when the video doesn't load
or can't be displayed.
Consider a single-source .mp4 video viewed in Firefox, as shown in Figure 5-2 .
Figure 5-2. Since Firefox doesn't support .mp4 files, the browser displays a dark gray box if there is
no poster image specified