You may have noticed the thumbnail of the video while watching it on YouTube. In this article, we will create the same thing using only HTML and no CSS/JavaScript.

To add a video with a poster, add the following code to your HTML:

<video poster="https://example.com/poster.png" width="640" height="480" controls>
  <source src="https://example.com/video.mp4" type="video/mp4">
</video>

This will add an image to the video. The controls attribute in the video tag is used to display play/pause controls to the user; otherwise, the video will be unplayable.

Try the live demo:

Thanks for reading

Follow me on Twitter

Thanks for reading!