Analysieren Sie den Grund, warum das MP4-Video im Video-Tag auf der H5-Webseite nicht abgespielt werden kann

Heute hat mich ein Freund gefragt: Warum kann das von mir aufgenommene MP4-Video lokal abgespielt werden, kann aber nicht normal mit dem Video-Multimedia-Wiedergabe-Tag von HTML5 abgespielt werden, wobei nur ein Fortschrittsbalken und kein Bild angezeigt wird? Damals war ich auch neugierig, ob MP4-Videos mit dem Video-Tag abgespielt werden können. Schließlich sind wir gute Freunde, also bin ich zu dem Schluss gekommen, dass dies der Fall ist Tatsächlich handelt es sich um ein Problem mit der Videokodierung. Obwohl das Format MP4 ist, unterstützt HTML nur das H.264-Kodierungsformat, sodass ich keine andere Wahl habe, als die Kodierung neu zu konvertieren.

Um zu vermeiden, dass alle auf das gleiche Problem stoßen, gebe ich Ihnen etwas Wissen über HTML5 über das <video>-Tag:

<video> angezeigt wird Lassen Sie Multimediadateien problemlos auf Webseiten abspielen.

Für die Wiedergabe eines Videos im HTML-Format ist nur ein Tag erforderlich:

Obwohl es viel weniger Code gibt, sind die Funktionen sehr solide. Dies ist einer der Highlights der HTML5-Bar!

Über die vom <video>-Tag unterstützten Videoformate und Kodierungen:

• MP4 = MPEG 4-Datei mit H264-Videocodec und AACAudio Codecs

• WebM = WebM-Dateien verwenden den VP8-Videocodec und den Vorbis-Audiocodec

• Ogg = Ogg-Dateien verwenden den Theora-Videocodec und den Vorbis-Audiocodec

Anhand der obigen Informationen werden wir feststellen, dass es nur h264-codierte MP4-Videos (MPEG-LA-Unternehmen), VP8-codierte WebM-Format-Videos (Google-Unternehmen) und Theora-codierte Ogg-Format-Videos gibt (iTouch-Entwicklung) kann das HTML5-Tag <video> unterstützen.

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

Zum Beispiel unterstützen IE-Browser und ältere Versionen von Browsern 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:

Auf diese Weise wird in einem Browser, der HTML5 nicht unterstützt, 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:

2. "movie.ogg" type="video/ ogg">

3. "movie.mp4" type="video/mp4">

4. Ihr Browser unterstützt dieses Videoformat nicht.

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

2. Steuerelemente: Das Auftreten dieses Attributs bedeutet, dass dem Benutzer Steuerelemente angezeigt werden, z. B. die Wiedergabetaste usw. Verwendung: control="controls"

3. Höhe: Einstellung Höhe Breite: Breite festlegen

4. Schleife: Automatische Wiedergabe, Verwendung: loop="loop"

5. preload: Video wird geladen, wenn die Seite geladen wird. Und zum Abspielen vorbereiten. Verwendung: preload="auto" – lädt das gesamte Video, wenn die Seite geladen wird. preload="meta" – lädt die Metadaten erst, nachdem die Seite geladen wurde „none“ – nicht laden, wenn die Seite geladen wird. < Ich werde das Tag „Video“ hier vorstellen. Ich glaube, jeder hat bereits ein tiefes Verständnis für dieses Tag! [Verwandte Empfehlungen]

1.
6. HTML/CSS-kostenloses Video-Tutorial

2.Lernen Sie, wie Sie HTML5-Audio und -Video verwenden

3.

Lernen Sie, wie Sie die Kompatibilität von Video-Tags in H5 in Browsern verbessern können

4.Erklären Sie im Detail die Standards für die Anzeige von Videos in HTML5

5. Kurze Beschreibung der Parameter und Attribute des <video>

Das obige ist der detaillierte Inhalt vonAnalysieren Sie den Grund, warum das MP4-Video im Video-Tag auf der H5-Webseite nicht abgespielt werden kann. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!