Wie bittest du Video in HTML mit dem & lt; Video & gt; Etikett?

Wie bittest du Video mit dem

Um ein Video in HTML mit dem <video></video> -Tag einzubetten, können Sie die folgende Grundstruktur verwenden:

 <code class="html"><video width="320" height="240" controls> <source src="video.mp4" type="video/mp4"> Your browser does not support the video tag. </source></video></code>

In diesem Beispiel:

• Die width und height definieren die Größe des Videoplayers.
• Das controls fügt Play-, Pause- und Lautstärkeregler hinzu.
• Das <source></source> -Tag im <video></video> -Element gibt die zu abgespielte Videodatei an. Das src -Attribut zeigt auf die Videodatei, und das type -Attribut gibt den MIME -Typ der Ressource an.
• Der Text "Ihr Browser unterstützt das Video -Tag nicht", dient als Fallback -Inhalt, falls der Browser das <video></video> -Element nicht unterstützt.

Was sind die wesentlichen Attribute für das

Um bei Verwendung des <video></video> -Tags die folgende wesentliche Attribute in Betracht zu ziehen:

1. SRC : Gibt die URL der Videodatei an. Während Sie dieses Attribut direkt auf dem <video></video> -Tag verwenden können, können Sie es im Element <source></source> -Elements besser verwenden, um mehrere Videoformate anzubieten.
2. Typ : Verwendet mit dem Element <source></source> , um den MIME -Typ der Videodatei anzuzeigen. Dies hilft den Browsern, die Verwendung zu bestimmen.
3. Steuerelemente : Fügt grundlegende Videokontrollen wie Spielen, Pause und Lautstärke hinzu. Es ist eine gute Praxis, dieses Attribut für die Benutzerfreundlichkeit aufzunehmen, obwohl Sie bei Bedarf benutzerdefinierte Steuerelemente entwerfen können.
4. Breite und Höhe : Stellen Sie die Abmessungen des Videoplayers ein. Diese können dazu beitragen, Layoutverschiebungen zu verhindern, während das Video lädt.
5. Vorspannung : Gibt an, wie das Video vorinstalliert werden soll. Zu den Optionen gehören none (keine Vorspannung), metadata (nur Metadaten wie Dauer) oder auto (laden Sie das gesamte Video). Dies kann die Leistung und Benutzererfahrung beeinflussen.
6. Poster : Gibt ein Bild an, das angezeigt werden soll, während das Video heruntergeladen wird oder bis der Benutzer die Wiedergabetaste trifft.

Durch die Verwendung dieser Attribute können Sie die Kompatibilität Ihres Videos über verschiedene Browser hinweg verbessern.

Können Sie gemeinsame Videoformate auflisten, die vom

Gemeinsame Videoformate, die vom <video></video> -Tag unterstützt werden, gehören:

1. MP4 : In modernen Browsern weit verbreitet. Um eine MP4 -Datei anzugeben, verwenden Sie:

    <code class="html"><source src="video.mp4" type="video/mp4"></source></code>

2. Webm : unterstützt von Chrome, Firefox, Opera und Edge. Verwenden Sie: Um eine Webm -Datei anzugeben, verwenden Sie:

    <code class="html"><source src="video.webm" type="video/webm"></source></code>

3. OGG : Unterstützt von Firefox, Opera und einigen älteren Versionen von Chrome. Um eine OGG -Datei anzugeben, verwenden Sie:

    <code class="html"><source src="video.ogv" type="video/ogg"></source></code>

Um eine breitere Kompatibilität zu gewährleisten, können Sie mehrere <source></source> -Anemente im <video></video> -Tag auflisten, sodass der Browser das erste unterstützte Format auswählen kann:

 <code class="html"><video width="320" height="240" controls> <source src="video.mp4" type="video/mp4"> <source src="video.webm" type="video/webm"> <source src="video.ogv" type="video/ogg"> Your browser does not support the video tag. </source></source></source></video></code>

Wie fügen Sie einem Video, das mit dem

Um einem Video, das mit dem <video></video> -Tag eingebettet ist, Untertitel oder Untertitel hinzufügen, können Sie das <track></track> -Element verwenden. So wie: wie:

 <code class="html"><video width="320" height="240" controls> <source src="video.mp4" type="video/mp4"> <track src="captions.vtt" kind="subtitles" srclang="en" label="English"> Your browser does not support the video tag. </track></source></video></code>

In diesem Beispiel:

• Das src -Attribut des Elements <track></track> zeigt auf die Datei webVtt (Web -Video -Texttracks), die die Untertitel oder Untertitel enthält.
• Das kind -Attribut gibt den Typ der Textspur an. Zu den Optionen gehören subtitles , captions , descriptions , chapters und metadata . Verwenden Sie für Untertitel oder Untertitel subtitles oder captions .
• Das srclang -Attribut gibt die Sprache des Textspurs an (z. B. en für Englisch).
• Das label -Attribut bietet einen benutzerlesbaren Titel für den Texttrack, der in einem Menü angezeigt werden kann, um verschiedene Untertitel auszuwählen.

Um sicherzustellen, dass die Untertitel oder Untertitel angezeigt werden, stellen Sie sicher, dass der Video -Player sie unterstützt (moderne Browser) und dass die WebVTT -Datei korrekt formatiert ist. Beispielsweise könnte eine grundlegende WebVTT -Datei so aussehen:

 <code>WEBVTT 00:00:00.000 --> 00:00:05.000 Hello, welcome to my video! 00:00:05.001 --> 00:00:10.000 Today we'll be discussing how to use the video tag.</code>

Dadurch wird der entsprechende Text zu den angegebenen Zeiten während der Videowiedergabe angezeigt.

Das obige ist der detaillierte Inhalt vonWie bittest du Video in HTML mit dem & lt; Video & gt; Etikett?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!