Ein Video einzubetten ist ähnlich wie das Einbetten von Audio. Die verwendeten Attribute und Tags sind vergleichbar. Lassen Sie uns einen detaillierten Blick darauf werfen.

Video einbetten

Der <video>-Tag bettet Videoinhalte in ein HTML-Dokument ein, sodass Benutzer Videos direkt im Browser abspielen können.

Video-Attribute

• controls: Fügt Videosteuerungen für Wiedergabe, Pause und Lautstärkeregelung hinzu;
• autoplay: Gibt die Autoplay-Funktionalität an;
• loop: Ermöglicht kontinuierliches Video-Looping.

Beispiel:

<video controls autoplay loop>
  <!-- Source tags will be defined here -->
</video>

Quelle

Das <source>-Tag wird innerhalb des <video>-Tags verwendet, um die Quelle (URL) der Videodatei und deren Attribute anzugeben. src gibt die URL der Videodatei an. type gibt den MIME-Typ der Videodatei an.
Beispiel:

<video controls autoplay loop>
  <source src="video-url.mp4" type="video/mp4" />
  <source src="video-url.webm" type="video/webm" />
  Your browser does not support the video element.
</video>

Im obigen Beispiel:

• Das <video>-Tag enthält die Attribute controls, autoplay und loop;
• Die <source>-Tags geben die Quell-URLs der Videodateien und deren MIME-Typen an;
• Wenn der Browser das <video>-Tag oder die angegebenen Videoformate nicht unterstützt, wird der alternative Text Your browser does not support the video element. angezeigt.

Video Tutorial