Detaillierte Einführung in das Video-Tag in HTML5

Dieser Artikel bietet Ihnen eine detaillierte Einführung in das Video-Tag in HTML5. Freunde in Not können darauf verweisen.

<video src="http://www.lorem.com/video/lorem.mp4" controls="controls" width="500" height="300"></video>

39000f942b2545a5315c57fa3276f220 Vom Tag unterstützte Videoformate und Kodierungen:

MP4 = MPEG 4-Datei mit H264-Videocodec und AAC-Audiocodec

WebM = WebM-Datei verwendet VP8-Videocodec und Vorbis-Audiocodec

Ogg = Ogg-Datei verwendet Theora-Videocodec und Vorbis-Audiocodec

Anhand der obigen Informationen finden wir nur h264-codierte MP4-Videos (MPEG-LA-Unternehmen) VP8-codierte Videos im WebM-Format (Google-Unternehmen) und Theora-codierte Videos im OGG-Format (iTouch-Entwicklung) können das HTML5-Tag 39000f942b2545a5315c57fa3276f220 unterstützen.

Was passiert, wenn der Browser das Video-Tag nicht unterstützt?

Zum Beispiel unterstützen IE-Browser und ältere Browserversionen HTML5 nicht sehr gut. Was sollten wir tun, wenn Benutzer diese Browser verwenden, um unsere Webseiten mit Videos zu öffnen?

Wir können den Code so schreiben:

<video src="http://sp.ntaotu.com/localhost-wordpress-phpstudy.mp4" controls="controls" width="500" height="300">您的浏览器不支持播放该视频！</video>

Auf diese Weise wird in Browsern, die HTML5 nicht unterstützen, die Meldung „Ihr Browser unterstützt die Wiedergabe dieses Videos nicht!“ angezeigt!

Erklärung der erweiterten Parameter des Video-Tags:

Das Videoelement ermöglicht mehrere Quellelemente. Das Quellelement kann verschiedene Videodateien verknüpfen. Der Browser verwendet das erste erkannte Format, sodass wir nur noch ein paar Videos in anderen Formaten vorbereiten müssen.

Verwendung:

<video width="500" height="250" controls="controls">
<source src="movie.ogg" type="video/ogg">
<source src="movie.mp4" type="video/mp4">
您的浏览器不支持此种视频格式。
</video>

Autoplay: Das Vorhandensein dieses Attributs bedeutet, dass das Video automatisch abgespielt wird, wenn es bereit ist. Verwendung: autoplay="autoplay"

Steuerelemente: Das Vorhandensein von Dieses Attribut bedeutet, dem Benutzer Steuerelemente wie Wiedergabeschaltflächen usw. anzuzeigen. Verwendung: Kontrollen="Steuerelemente"

Höhe: Höhe festlegen

Breite: Breite festlegen

loop: automatische Wiedergabe, Verwendung: loop="loop"

preload: Das Video wird geladen und für die Wiedergabe vorbereitet, wenn die Seite geladen wird. Verwendung: preload="auto" - Laden Sie das gesamte Video nach Seite wird geladen; preload="meta" – Metadaten nur laden, wenn die Seite geladen wird; preload="none" – Video nicht laden, wenn die Seite geladen wird. Hinweis: Wenn Autoplay verwendet wird, wird das Vorladen ignoriert. Verständnis!

Das obige ist der detaillierte Inhalt vonDetaillierte Einführung in das Video-Tag in HTML5. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!