Video & Audio in HTML
From the HTML cheat sheet · Media & Graphics · verified Jul 2026
Video & Audio
Multimedia elements with controls
css
<!-- Video element -->
<video controls width="640" height="360" poster="thumbnail.jpg">
<source src="video.webm" type="video/webm">
<source src="video.mp4" type="video/mp4">
<p>Your browser doesn't support HTML5 video.</p>
</video>
<!-- Audio element -->
<audio controls>
<source src="audio.ogg" type="audio/ogg">
<source src="audio.mp3" type="audio/mpeg">
<p>Your browser doesn't support HTML5 audio.</p>
</audio>
<!-- Video with attributes: controls, autoplay, muted (required for autoplay), loop, preload=none|metadata|auto -->
<video controls autoplay muted loop preload="metadata">
<source src="video.mp4" type="video/mp4">
</video>html
<video controls width="320" height="240">
<source src="movie.mp4" type="video/mp4">
<track kind="subtitles" src="subs.vtt" srclang="en" label="English">
Your browser doesn't support video.
</video>🟢 Essential - Provide multiple formats for compatibility
💡 Use poster for video thumbnail
📌 Track elements for subtitles/captions
⚠️ Autoplay requires muted attribute
⚡ preload="metadata" loads video info only
videoaudiomedia