HTML таг `video`

Пример

Кратък пример как се използва тагът <video>.

<video width="640" height="360" controls poster="poster-image.jpg">
  <source src="movie.mp4" type="video/mp4">
  <source src="movie.webm" type="video/webm">
  Вашият браузър не поддържа HTML5 видео. 
  <a href="movie.mp4">Изтеглете видеото</a>.
</video>

Опитай в редактора

Дефиниция и употреба

Виж как се ползва тагът <video>.

Елементът <video> се използва за вграждане и възпроизвеждане на видео съдържание директно в уеб страница, без нужда от външни плъгини (като Flash). Той поддържа няколко видео формата (най-често MP4, WebM и Ogg) чрез вложени елементи <source>, всеки със собствен атрибут src и type. Браузърът избира първия формат, който поддържа.

Най-често се използва с атрибута controls, който показва вградени контроли за възпроизвеждане (пускане, пауза, сила на звука, прогрес бар и др.). Без controls потребителят няма стандартен начин да управлява видеото, освен ако не се добавят собствени JavaScript контроли.

Често се задават и размери чрез атрибутите width и height, както и изображение за предварителен преглед чрез атрибута poster, което се показва преди стартиране на видеото. Вътре в <video> може да има резервен текст и линкове (fallback съдържание), които се показват, ако браузърът не поддържа HTML5 видео.

Елементът поддържа и допълнителни атрибути като autoplay (автоматично стартиране), loop (циклично възпроизвеждане), muted (заглушен звук по подразбиране), playsinline (възпроизвеждане в страницата на мобилни устройства) и preload (как да се зарежда видеото предварително). За субтитри и допълнителни текстови писти се използва вътрешният елемент <track>.

Browser Support

Browser	Поддръжка
Chrome	✔️
Firefox	✔️
Edge	✔️
Safari	✔️
Opera	✔️

Атрибути

Атрибут	Описание
`src`	Път до видео файла (по-често се използват вложени `<source>` елементи вместо този атрибут).
`controls`	Показва стандартните контроли за възпроизвеждане (бутон play/pause, прогрес, сила на звука и др.).
`autoplay`	Стартира видеото автоматично при зареждане на страницата (често изисква и `muted` заради политики на браузърите).
`loop`	След приключване видеото започва отново автоматично.
`muted`	Заглушава звука на видеото по подразбиране.
`poster`	URL към изображение, което се показва преди стартиране на видеото или когато е спряно.
`preload`	Подсказва как да се зарежда видеото: `none`, `metadata` или `auto`.
`width`, `height`	Ширина и височина на видео плейъра в CSS пиксели.
`playsinline`	Позволява възпроизвеждане в самата страница на мобилни устройства, вместо на цял екран.

Тагове

a abbr address area article aside audio b base bdi bdo blockquote body br button canvas caption cite code col colgroup data datalist dd del details dfn dialog div dl dt em embed fencedframe fieldset figcaption figure footer form h1 h2 h3 h4 h5 h6 head header hgroup hr html i iframe img input ins kbd label legend li link main map mark menu meta meter nav noscript object ol optgroup option output p picture pre progress q rp rt ruby s samp script search section select selectedcontent slot small source span strong style sub summary sup table tbody td template textarea tfoot th thead time title tr track u ul var video wbr

HTML таг video