Самоучитель HTML Справочник HTML Глобальные атрибуты События Типы элементов Таблица цветов Спецсимволы HTML Коды языков
Теги HTML

HTML тег <video>

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

12.0+ 9.0+ 3.5+ 4.0+ 10.5+ 4.0+

Описание

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

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

Примечание: атрибутам controls, autoplay и loop при использовании не обязательно должны быть присвоены значения, эти атрибуты являются атрибутами булева типа, то есть если атрибут указан, то данная функция считается включенной, если не указан - выключенной.

Атрибуты

autoplay:
Указывает, что воспроизведение видеофайла должно начинаться автоматически, как только файл будет полностью загружен. Значения для логического атрибута autoplay можно задавать следующими способами:
<video autoplay>
<video autoplay="autoplay">
<video autoplay="">
Пример »
controls:
Отображает элементы управления воспроизведением, включающие в себя: запуск, паузу, полосу прокрутки, громкость звука, включение полноэкранного режима, титры/субтитры (при наличии) и звуковую дорожку (при наличии). Значения для логического атрибута controls можно задавать следующими способами:
<video controls>
<video controls="controls">
<video controls="">
Пример »
height:
Устанавливает высоту видеоплеера в пикселях (пример: height="200"). Пример »
loop:
Указывает, что воспроизведение будет начинаться сначала, каждый раз, после завершения (повтор воспроизведения). Значения для логического атрибута loop можно задавать следующими способами:
<video loop>
<video loop="loop">
<video loop="">
Пример »
muted:
Позволяет отключить звук, чтобы по умолчанию видео воспроизводилось беззвучно, при желании пользователь сможет включить звук самостоятельно. Возможные значения логического атрибута muted:
<video muted>
<video muted="muted">
<video muted="">
Пример »

Примечание: атрибут muted не поддерживается в IE9 и более ранних версиях.

poster:
Указывает URL-адрес изображения (картинки), которое будет отображаться пока видеофайл загружается или пока пользователь не нажмет кнопку воспроизведения. Если атрибут не установлен, то браузер отображает первый кадр видеоролика. Пример »
preload:
Указывает, какие действия должен выполнять браузер, если для видеоплеера не указан атрибут autoplay. При совместном использовании с атрибутом autoplay атрибут preload будет проигнорирован. Он может принимать одно из следующих трех значений:
  • auto - загрузка видеофайла начнется после загрузки страницы
  • metadata - сбор информации о видеофайле: размер, первый кадр, список воспроизведения, длительность
  • none - загрузка видеофайла начнется только после щелчка мыши по кнопке воспроизведение
Пример »

Примечание: атрибут preload не поддерживается браузером Internet Explorer.

src:
Определяет путь к нужному видеофайлу (путь может быть либо абсолютным либо относительным). Пример »
width:
Устанавливает ширину видеоплеера в пикселях (пример: width="200"). Пример »

Тег <video> так же поддерживает Глобальные атрибуты и События

Стиль по умолчанию

Нет.

Пример

<video width="400" height="257" controls="controls" poster="video/duel.jpg">
  <source src="movie.ogg" type="video/ogg">
  Ваш браузер не поддерживает тег video.
</video>

Результат данного примера в окне браузера:

Пример использования тега <video>
Копирование материалов с данного сайта возможно только с разрешения администрации сайта
и при указании прямой активной ссылки на источник.
2011 – 2024 © puzzleweb.ru | razumnikum.ru

Реклама на сайте | puzinfo@puzzleweb.ru | ruen