Тег <video> HTML используется для вставки на сайт воспроизводимого видео. Обычно содержит вложенные элементы <source> для указания нескольких вариантов источника видео-файла.
Для указания субтитров, глав и другой текстовой информации используется тег <track>.
Этот тег был введен в HTML5.
Синтаксис
<video>вложенные теги / альтернативный текст</video>
Альтернативный текст. Вы можете указать внутри тега <video> альтернативный текст. Он будет выведен, если ваш браузер не поддерживает тег.
Примеры использования <video> в HTML коде
<!DOCTYPE html>
<html>
<head>
<title>Вставка видео на сайт</title>
</head>
<body>
<video width="1280" height="720" autoplay controls loop>
<source src="/video/my_video.mp4" type="video/mp4">
<source src="/video/my_video.ogg" type="video/ogg">
Воспроизведение видео-файла не поддерживается браузером
</video>
</body>
</html>
Поддержка браузерами
| Тег | |||||
| <video> | Да | 9+ | Да | Да | Да |
| Поддержка форматов | |||||
| MP4 | Да | Да | Да | Да | Да |
| WebM | Да | Нет | Да | Нет | Да |
| Ogg | Да | Нет | Да | Нет | Да |
Атрибуты
| Атрибут | Значения | Описание |
|---|---|---|
| autoplay | не указывается / autoplay |
Если указан, видео будет воспроизведено, как только будет загружено. |
| controls | не указывается / controls |
Если указан, будут выведены кнопки управления плеером (play, pause и т.д.). |
| height | число |
Устанавливает высоту видео. |
| loop | не указывается / loop |
Если указан, видео будет циклически воспроизводиться до закрытия страницы (после завершения, воспроизведение начнется сначала). |
| muted | не указывается / muted |
Если указан, видео будет воспроизведено без звука. |
| poster | URL |
Адрес картинки - превью. Превью выводится на месте видеоплеера пока воспроизведение видео не началось. |
| preload |
auto |
Определяет особенности загрузки видео элемента. Если указан атрибут autoplay, атрибут preload будет проигнорирован. |
| src | URL |
Адрес видео-файла. |
| width | число |
Устанавливает ширину видео. |