HTML video
Element HTML <video>se používá k zobrazení videa na webové stránce.
Element <video> HTML
Chcete-li zobrazit video v HTML, použijte <video>prvek:
Příklad
<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>
Jak to funguje
Atribut controlspřidává ovládací prvky videa, jako je přehrávání, pauza a hlasitost.
Je dobré vždy zahrnout widtha heightatributy. Pokud nejsou nastaveny výška a šířka, stránka může během načítání videa blikat.
Prvek <source>umožňuje zadat alternativní video soubory, ze kterých si může prohlížeč vybrat. Prohlížeč použije první rozpoznaný formát.
Text mezi značkami <video>a se zobrazí pouze v prohlížečích, které prvek </video>nepodporují .<video>
HTML <video> Automatické přehrávání
Chcete-li video spustit automaticky, použijte autoplayatribut:
Příklad
<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>
Poznámka: Prohlížeče Chromium ve většině případů automatické přehrávání neumožňují. Ztlumené automatické přehrávání je však vždy povoleno.
Chcete-li, aby se video začalo přehrávat automaticky (ale ztlumeno), přidejte mutedpo :
autoplay
Příklad
<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>
Podpora prohlížeče
Čísla v tabulce určují první verzi prohlížeče, která
<video>prvek plně podporuje.
| Element | |||||
|---|---|---|---|---|---|
| <video> | 4.0 | 9.0 | 3.5 | 4.0 | 10.5 |
Video formáty HTML
Existují tři podporované formáty videa: MP4, WebM a Ogg. Prohlížeč podporuje různé formáty:
| Browser | MP4 | WebM | Ogg |
|---|---|---|---|
| Edge | YES | YES | YES |
| Chrome | YES | YES | YES |
| Firefox | YES | YES | YES |
| Safari | YES | YES | NO |
| Opera | YES | YES | YES |
HTML video – typy médií
| File Format | Media Type |
|---|---|
| MP4 | video/mp4 |
| WebM | video/webm |
| Ogg | video/ogg |
HTML video – metody, vlastnosti a události
HTML DOM definuje metody, vlastnosti a události pro <video>prvek.
To vám umožní načítat, přehrávat a pozastavovat videa a také nastavit dobu trvání a hlasitost.
Existují také události DOM, které vás mohou upozornit, když se video začne přehrávat, je pozastaveno atd.
Úplnou referenci DOM naleznete v našem HTML Audio/Video DOM Reference .
HTML značky videa
| Tag | Description |
|---|---|
| <video> | Defines a video or movie |
| <source> | Defines multiple media resources for media elements, such as <video> and <audio> |
| <track> | Defines text tracks in media players |