HTML-видео

HTML-элемент <video> используется для отображения видео на веб-странице.

Элемент HTML <video>

Чтобы показать видео в HTML, используйте элемент <video>:

<video width="320" height="240" controls> <source src="movie.mp4" type="video/mp4"> <source src="movie.ogg" type="video/ogg"> Your browser does not support the video tag. </video>

Принцип действия

Атрибут controls добавляет элементы управления видео, такие как воспроизведение, пауза и громкость.

Рекомендуется всегда включать атрибуты width и height. Если высота и ширина не заданы, страница может мерцать во время загрузки видео.

Элемент <source> позволяет указать альтернативные видеофайлы, из которых браузер может выбирать. Браузер будет использовать первый распознанный формат.

HTML <видео> Автовоспроизведение

Чтобы запустить видео автоматически, используйте атрибут autoplay:

<video width="320" height="240" autoplay> <source src="movie.mp4" type="video/mp4"> <source src="movie.ogg" type="video/ogg"> Your browser does not support the video tag. </video>

Добавьте отключение звука после автозапуска, чтобы ваше видео начало воспроизводиться автоматически (но без звука).:

<video width="320" height="240" autoplay muted> <source src="movie.mp4" type="video/mp4"> <source src="movie.ogg" type="video/ogg"> Your browser does not support the video tag. </video>

Поддержка браузера

Цифры в таблице указывают первую версию браузера, которая полностью поддерживает элемент <video>.

Видеоформаты HTML

Поддерживаются три видеоформата: MP4, WebM и Ogg. Поддержка браузера для различных форматов:

HTML-видео - Типы носителей

HTML-видео - методы, свойства и события

HTML DOM определяет методы, свойства и события для элемента <video>.

Это позволяет загружать, воспроизводить и приостанавливать видео, а также устанавливать продолжительность и громкость.

Есть также события DOM, которые могут уведомлять вас, когда видео начинает воспроизводиться, приостанавливается и т. д.