HTML Video (Wideo) Play
Istnieje wiele sposobów, aby odtworzyć film w metodzie HTML.
HTML Video (Wideo) Play
Przykłady
<source src="movie.mp4" type="video/mp4">
<source src="movie.ogg" type="video/ogg">
<source src="movie.webm" type="video/webm">
<object data="movie.mp4" width="320" height="240">
<embed src="movie.swf" width="320" height="240">
</object>
</video>
Spróbuj »
Problemy i rozwiązania
Odtwórz wideo w formacie HTML nie jest łatwe!
wiele znanych wskazówek trzeba upewnić się, że plik wideo we wszystkich przeglądarkach (Internet Explorer, Chrome, Firefox, Safari, Opera), a cały sprzęt (PC, Mac, iPad, iPhone) mogą być odtwarzane.
W tym rozdziale W3CSchool podsumować problemy i rozwiązania.
Używając <embed> tag
Rola <embed> jest osadzenie elementów multimedialnych na stronach HTML.
Poniższy kod HTML do wyświetlania wideo Flash osadzonego na stronie:
problem
- HTML4 nie rozpoznaje <embed> tag. Twoja strona nie może zostać zweryfikowana.
- Jeśli Twoja przeglądarka nie obsługuje Flasha, aby film nie jest odtwarzany
- iPad i iPhone nie może wyświetlić wideo Flash.
- Jeśli konwersji plików wideo do innych formatów, to nadal nie gra we wszystkich przeglądarkach.
Użycie znacznika <object>
Rola <object> tag jest osadzenie elementów multimedialnych na stronach HTML.
Poniższy kod HTML pokazuje jakiś video Flash osadzonego na stronie:
problem:
- Jeśli Twoja przeglądarka nie obsługuje Flasha, film nie jest odtwarzany.
- iPad i iPhone nie może wyświetlić wideo Flash.
- Jeśli konwersji plików wideo do innych formatów, to nadal nie gra we wszystkich przeglądarkach.
Korzystanie z HTML5 <video> elementu
HTML5 <video> tag definiuje wideo lub film.
<Video> elementem wszystkich nowoczesnych przeglądarkach są obsługiwane.
Poniższy fragment HTML wyświetli stronę WWW wbudowaną OGG, MP4, lub w formacie WebM wideo:
Przykłady
<source src="movie.mp4" type="video/mp4">
<source src="movie.ogg" type="video/ogg">
<source src="movie.webm" type="video/webm">
您的浏览器不支持 video 标签。
</video>
Spróbuj »
problem:
- Trzeba konwertować wideo do różnych formatów.
- <Video> element nie jest ważny w starszych przeglądarkach.
Najlepszy HTML Rozwiązanie
W poniższym przykładzie użyto czterech różnych formatów wideo. HTML 5 <video> Element próbuje odtwarzać mp4, ogg lub formatach WebM jest, aby odtworzyć film. Jeśli wszystko zawiedzie, po czym powróci do <embed> elementu.
HTML 5 + <object> + <embed>
<source src="movie.mp4" type="video/mp4">
<source src="movie.ogg" type="video/ogg">
<source src="movie.webm" type="video/webm">
<object data="movie.mp4" width="320" height="240">
<embed src="movie.swf" width="320" height="240">
</object>
</video>
Spróbuj »
problem:
- Musisz przekonwertować wiele różnych formatów wideo
Youku Solutions
Najprostszym sposobem, aby wyświetlić wideo w HTML jest użycie Youku i innych witryn wideo.
Jeśli chcesz odtworzyć film na stronie internetowej, można przesłać film do Youku i innych witryn wideo, a następnie wstawić kod HTML, aby odtworzyć film na swojej stronie:
Używanie hiperłączy
Jeśli strona zawiera hiperłącze wskazujące na pliki multimedialne, większość przeglądarek użyje "aplikacji pomocnika", aby go odtworzyć.
Poniższy fragment kodu pokazuje linki do pliku AVI. Jeśli użytkownik kliknie na link, przeglądarka zacznie się "Helper Applications", takich jak Windows Media Player do odtwarzania plików AVI:
Na rolkach opisie filmu
Gdy film jest zawarte na stronie internetowej, jest on nazywany inline wideo.
Jeśli masz zamiar użyć inline wideo w aplikacji internetowej, trzeba zdać sobie sprawę, że wiele osób uważa inline filmy denerwujące.
Należy również pamiętać, że użytkownicy mogą mieć opcję wideo inline przeglądarka zamknięte.
Nasza najlepsza rada jest tylko wtedy, gdy użytkownik chce zobaczyć film miejscem inline je zawiera. Pozytywnym przykładem jest to, że gdy użytkownik musi zobaczyć film i kliknij w link otworzy stronę i odtworzyć film.
HTML tag multimedialny
Nowość: HTML5 nowe tagi.
标签 | 描述 |
---|---|
<embed> | 定义内嵌对象。HTML4 中不赞成,HTML5 中允许。 |
<object> | 定义内嵌对象。 |
<param> | 定义对象的参数。 |
<audio> New | 定义了声音内容 |
<video> New | 定义一个视频或者影片 |
<source> New | 定义了media元素的多媒体资源(<video> 和 <audio>) |
<track> New | 规定media元素的字幕文件或其他包含文本的文件 (<video> 和<audio>) |