HTML5-Tutorial-Video

Hallo zusammen, HTML5 ist ein großer Sprung in der Web-Frontend-Entwicklung im letzten Jahrzehnt. Im Gegensatz zu früheren Versionen wird HTML 5 nicht nur zur Darstellung von Webinhalten verwendet. Seine neue Mission besteht darin, das Web zu einer ausgereiften Anwendungsplattform zu machen. Auf der HTML 5-Plattform sind Video, Audio, Bilder, Animationen und computerbasierte Interaktionen standardisiert .

Als nächstes stelle ich Ihnen das HTML5-Tutorial-Video vor.

Viele trendige Websites bieten Videos an. HTML5 bietet einen Standard für die Anzeige von Videos.

Videos im Web

Bisher gab es keinen Standard für die Anzeige von Videos auf Webseiten.

Heutzutage werden die meisten Videos über Plug-ins (z. B. Flash) angezeigt. Allerdings verfügen nicht alle Browser über die gleichen Plugins.

HTML5 gibt eine Standardmethode zum Einbinden von Videos über das Videoelement an.

Videoformat

Derzeit unterstützt das Videoelement drei Videoformate:

Ogg: mit Theora-Videokodierung und Vorbis-Audiokodierung Ogg Datei;

MPEG4: MPEG 4-Datei mit H.264-Videokodierung und AAC-Audiokodierung;

WebM: WebM-Datei mit VP8-Videokodierung und Vorbis-Audiokodierung.

So funktioniert es

Um ein Video in HTML5 anzuzeigen, benötigen Sie lediglich:

<video src=”movie.ogg” controls=”controls”>
</video>

Das Steuerattribut zum Hinzufügen von Wiedergabe-, Pausen- und Lautstärkereglern.

Es ist auch eine gute Idee, Breiten- und Höhenattribute einzubeziehen. Der zwischen

Das obige Beispiel verwendet eine Ogg-Datei und ist für die Browser Firefox, Opera und Chrome geeignet.

Um sicherzustellen, dass es mit Safari funktioniert, muss die Videodatei vom Typ MPEG4 sein.

<video src=”movie.ogg” width=”320″ height=”240″ controls=”controls”>
Your browser does not support the video tag.
</video>

Das Videoelement ermöglicht mehrere Quellelemente. Das Quellelement kann verschiedene Videodateien verknüpfen. Der Browser verwendet das erste erkannte Format:

Beispiel:

Internet Explorer

Internet Explorer 8 unterstützt das Videoelement nicht. In IE 9 wird es Unterstützung für das Videoelement mit MPEG4 geben.

<video width=”320″ height=”240″ controls=”controls”>
<source src=”movie.ogg” type=”video/ogg”>
<source src=”movie.mp4″ type=”video/mp4″>
Your browser does not support the video tag.
</video>