In this section, we will learn what the poster attribute is and how to use it.

What is poster Attribute in HTML <video> Tag?

By default, if you have a video player in your HTML document, until users hit the play button to watch a video file, that video player might display a black screen or a random picture of the video file that is used to display.

But with the help of the poster attribute, we can set a picture (poster) to be displayed on the screen until users hit the play button.

HTML poster Attribute in <video> Tag Syntax:

<video poster = “URL> </video>

<video> Tag poster Attribute Values

The value we set for the poster attribute is the address of the target picture that we want to display on the video player.

Example: using poster attribute in HTML <video> tag

See the Pen using poster attribute in HTML <video> tag by Omid Dehghan (@odehghan) on CodePen.