HTML5 introduced the <video> element for embedding videos in web pages. The <video> element allows for displaying videos in different formats and resolutions and provides controls for playback, volume, and other settings.
Example:
<video width="320" height="240" controls>
<source src="video.mp4" type="video/mp4">
<source src="video.webm" type="video/webm">
Your browser does not support the video tag.
</video>
In this example, the width and height attributes set the dimensions of the video player, while the controls attribute enables playback controls such as play, pause, and volume. The <source> element provides the video files in different formats to ensure compatibility with different browsers. If the browser does not support the <video> element, the text “Your browser does not support the video tag.” will be displayed.
Other attributes that can be used with the <video> element include:
autoplay: starts playing the video automatically.loop: replays the video when it reaches the end.muted: starts the video with the sound muted.poster: sets an image that will be displayed while the video is loading.
Additionally, JavaScript can be used to manipulate the video playback and interact with other elements on the page.