Inhaltsverzeichnis
Für die Wiedergabe eines Videos im HTML-Format ist nur ein Tag erforderlich: " >Für die Wiedergabe eines Videos im HTML-Format ist nur ein Tag erforderlich:
Was passiert, wenn der Browser das Video-Tag nicht unterstützt? " >Was passiert, wenn der Browser das Video-Tag nicht unterstützt?
Erklärung der erweiterten Parameter des Video-Tags: " >Erklärung der erweiterten Parameter des Video-Tags:
Heim Web-Frontend H5-Tutorial So lösen Sie das Problem, dass MP4-Videos nicht mit dem Video-Tag auf H5-Webseiten abgespielt werden können

So lösen Sie das Problem, dass MP4-Videos nicht mit dem Video-Tag auf H5-Webseiten abgespielt werden können

Apr 08, 2019 pm 02:13 PM
html5 video

Warum kann das aufgezeichnete MP4-Video lokal abgespielt werden, das Video-Multimedia-Wiedergabe-Tag mit HTML5 kann jedoch nicht normal abgespielt werden, da nur ein Fortschrittsbalken und kein Bild angezeigt wird? Tatsächlich handelt es sich um ein Videokodierungsproblem. Obwohl es sich bei allen Formaten um MP4 handelt, bleibt mir nichts anderes übrig, 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: Wann Verwenden des HTML4-Protokolls zum Erstellen einer Website. Wenn wir ein Video auf der Webseite abspielen möchten, müssen wir es mit Flash abspielen oder eine eingebettete Seite verwenden, um dies zu erreichen. Für HTML5 sind diese beiden Methoden sehr unpraktisch, da eine awesome <video> erscheint. Die Funktion dieses Tags besteht darin, die einfache Wiedergabe von Multimediadateien auf Webseiten zu ermöglichen.

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 eines der Highlights von HTML5!

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

  • MP4 = MPEG 4-Datei verwendet H264-Videocodec und AAC-Audiocodec-Codecs

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

  • Ogg = Ogg-Dateien verwenden Theora-Videocodec Decoder und 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 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:

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:

  1. "movie.ogg" type="video/ogg"> ;

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

  3. Ihr Browser unterstützt dieses Videoformat nicht.

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

  2. Steuerelemente: Das Vorhandensein dieses Attributs bedeutet, dass dem Benutzer Steuerelemente wie Wiedergabeschaltflächen usw. angezeigt werden. Verwendung: steuert= „Steuerelemente“

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

  4. Schleife: automatische Wiedergabe, Verwendung: Schleife="Schleife"

  5. preload: Das Video wird geladen und für die Wiedergabe vorbereitet, wenn die Seite geladen wird. Verwendung: preload="auto" – lädt das gesamte Video, wenn die Seite geladen wird; preload="meta" – lädt nur Metadaten nach dem Laden der Seite; preload="none" – Video wird beim Laden der Seite nicht geladen. < Ich werde das Video-Tag hier vorstellen. Ich glaube, dass jeder ein tiefes Verständnis für dieses Tag hat! [Empfohlener Kurs:

    Html5-Video-Tutorial
  6. ]

Das obige ist der detaillierte Inhalt vonSo lösen Sie das Problem, dass MP4-Videos nicht mit dem Video-Tag auf H5-Webseiten abgespielt werden können. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn

Heiße KI -Werkzeuge

Undresser.AI Undress

Undresser.AI Undress

KI-gestützte App zum Erstellen realistischer Aktfotos

AI Clothes Remover

AI Clothes Remover

Online-KI-Tool zum Entfernen von Kleidung aus Fotos.

Undress AI Tool

Undress AI Tool

Ausziehbilder kostenlos

Clothoff.io

Clothoff.io

KI-Kleiderentferner

AI Hentai Generator

AI Hentai Generator

Erstellen Sie kostenlos Ai Hentai.

Heiße Werkzeuge

Notepad++7.3.1

Notepad++7.3.1

Einfach zu bedienender und kostenloser Code-Editor

SublimeText3 chinesische Version

SublimeText3 chinesische Version

Chinesische Version, sehr einfach zu bedienen

Senden Sie Studio 13.0.1

Senden Sie Studio 13.0.1

Leistungsstarke integrierte PHP-Entwicklungsumgebung

Dreamweaver CS6

Dreamweaver CS6

Visuelle Webentwicklungstools

SublimeText3 Mac-Version

SublimeText3 Mac-Version

Codebearbeitungssoftware auf Gottesniveau (SublimeText3)

Tabellenrahmen in HTML Tabellenrahmen in HTML Sep 04, 2024 pm 04:49 PM

Anleitung zum Tabellenrahmen in HTML. Hier besprechen wir verschiedene Möglichkeiten zum Definieren von Tabellenrändern anhand von Beispielen für den Tabellenrand in HTML.

HTML-Rand links HTML-Rand links Sep 04, 2024 pm 04:48 PM

Anleitung zum HTML-Rand links. Hier besprechen wir einen kurzen Überblick über HTML margin-left und seine Beispiele sowie seine Code-Implementierung.

Verschachtelte Tabelle in HTML Verschachtelte Tabelle in HTML Sep 04, 2024 pm 04:49 PM

Dies ist eine Anleitung für verschachtelte Tabellen in HTML. Hier diskutieren wir anhand der entsprechenden Beispiele, wie man eine Tabelle innerhalb der Tabelle erstellt.

HTML-Tabellenlayout HTML-Tabellenlayout Sep 04, 2024 pm 04:54 PM

Leitfaden zum HTML-Tabellenlayout. Hier besprechen wir die Werte des HTML-Tabellenlayouts zusammen mit den Beispielen und Ausgaben im Detail.

HTML-Eingabeplatzhalter HTML-Eingabeplatzhalter Sep 04, 2024 pm 04:54 PM

Leitfaden für HTML-Eingabeplatzhalter. Hier besprechen wir die Beispiele für HTML-Eingabeplatzhalter zusammen mit den Codes und Ausgaben.

HTML-geordnete Liste HTML-geordnete Liste Sep 04, 2024 pm 04:43 PM

Leitfaden zur HTML-geordneten Liste. Hier besprechen wir auch die Einführung von HTML-geordneten Listen und Typen sowie deren Beispiele

Text in HTML verschieben Text in HTML verschieben Sep 04, 2024 pm 04:45 PM

Anleitung zum Verschieben von Text in HTML. Hier besprechen wir eine Einführung, wie Marquee-Tags funktionieren, mit Syntax und Beispielen für die Implementierung.

HTML-Onclick-Button HTML-Onclick-Button Sep 04, 2024 pm 04:49 PM

Anleitung zum HTML-OnClick-Button. Hier diskutieren wir deren Einführung, Funktionsweise, Beispiele und Onclick-Events in verschiedenen Veranstaltungen.

See all articles