0Pricing
HTML Academy · Lesson

The video Element and Aspect Ratio

Embed video and maintain correct aspect ratios.

The video Element

The <video> element embeds video natively:

<video controls width="800" height="450" src="tutorial.mp4">
  Your browser does not support video.
</video>

Essential Attributes

Important video attributes:

<video
  src="demo.mp4"
  controls           <!-- show player UI -->
  width="1280"       <!-- intrinsic width -->
  height="720"       <!-- intrinsic height -->
  poster="preview.jpg" <!-- thumbnail before play -->
  preload="metadata"   <!-- preload only metadata -->
>
  Your browser does not support video.
</video>

All lessons in this course

  1. The audio Element src controls loop autoplay
  2. The video Element and Aspect Ratio
  3. The source Element for Multiple Formats
  4. Subtitles with track and WebVTT
← Back to HTML Academy