HTML5 introduced native <audio> and <video> elements — no plugins like Flash needed.
HTML Video
Video Element
<!-- Basic video with controls -->
<video width="640" height="360" controls>
<source src="movie.mp4" type="video/mp4">
<source src="movie.webm" type="video/webm">
Your browser does not support the video tag.
</video>
<!-- Autoplay, muted, loop (common for background videos) -->
<video autoplay muted loop playsinline
style="width:100%; height:auto;">
<source src="background.mp4" type="video/mp4">
</video>
<!-- With poster image (shown before video plays) -->
<video controls poster="thumbnail.jpg" width="640">
<source src="tutorial.mp4" type="video/mp4">
</video>
Video Attributes
Attribute
Description
controls
Shows play/pause/volume controls
autoplay
Starts playing automatically (requires muted in most browsers)
muted
Mutes the audio
loop
Repeats the video
poster
Image shown before the video plays
preload
auto, metadata, or none
width / height
Dimensions in pixels
HTML Audio
Audio Element
<!-- Basic audio player -->
<audio controls>
<source src="music.mp3" type="audio/mpeg">
<source src="music.ogg" type="audio/ogg">
Your browser does not support the audio element.
</audio>
<!-- Autoplay background music (muted by default in browsers) -->
<audio autoplay loop muted>
<source src="background.mp3" type="audio/mpeg">
</audio>
Supported Formats
Format
Type
Browser Support
MP4 (H.264)
Video
All major browsers
WebM
Video
Chrome, Firefox, Edge
OGG
Video/Audio
Firefox, Chrome
MP3
Audio
All major browsers
WAV
Audio
All major browsers
Always provide multiple <source> formats for maximum browser compatibility. MP4 + WebM covers virtually all browsers.