Anhand der folgenden Beispiele können Sie einen Film in ein HTML-Dokument einbetten. Aus Kompatibilitätsgründen empfehlen wir die Verwendung des MP4-Videoformats, das von allen gängigen Browsern und Betriebssystemen unterstützt wird.
Das Hosten von Filmen auf Ihrem Server kann aufgrund der Bandbreitenkosten teuer sein. Eine Alternative besteht darin, das Video auf YouTube zu hosten und den YouTube-Videolink auf Ihrer Webseite einzubetten.
Nicht alle der folgenden Vorschläge funktionieren für alle Browser. Stellen Sie sicher, dass die Lösung, für die Sie sich entscheiden, mit den Browsern funktioniert, die Sie unterstützen möchten.
Link zu Filmdateien
Die folgenden Beispiele bieten verschiedene Methoden, um die Videodatei im Browserfenster sichtbar zu machen. Wir empfehlen außerdem, einen direkten Download-Link zu der Datei zu erstellen, der es Besuchern ermöglicht, die Datei herunterzuladen, wenn der Film nicht im Browser abgespielt werden kann. Nachfolgend finden Sie zwei Beispiele für direkte Links zu den beiden Videodateien auf dieser Seite.
Diskettenlaufwerk-Roboter
HTML Quelltext
<a href="https://www.computerhope.com/issues/floppy2.avi">Floppy drive robot</a>
IBM Linux-Werbung
HTML Quelltext
<a href="https://www.computerhope.com/issues/ibm-linux.mov">IBM Linux commercial</a>
Betten Sie ein YouTube-Video ein
Das Hosten von Videos auf YouTube ist großartig, weil es Bandbreitenkosten spart, viele Zuschauer unterstützen kann und Ihre Videos den Besuchern der meisten Internetseiten vorstellt. Unten sehen Sie ein Beispiel für ein auf YouTube gehostetes und auf dieser Website eingebettetes Video.
HTML Quelltext
Den HTML-Code für alle YouTube-Videos finden Sie über den Freigabe-Link, den Sie in jedem YouTube-Video finden. Nachdem Sie auf den Link „Teilen“ geklickt haben, klicken Sie auf den Link „Einbetten“. Unten ist ein Beispiel für den Code, der verwendet wird, um das obige YouTube-Video anzuzeigen.
<object height="350" width="425">
<param name="movie" value="https://www.youtube.com/v/R3ymHMgFAps">
<param name="wmode" value="transparent">
<embed height="350" src="https://www.youtube.com/v/R3ymHMgFAps?rel=0" type="application/x-shockwave-flash" width="425" wmode="transparent"> </object>
Video-Tag
Das
HTML Quelltext
<video class="tab" controls>Your browser does not support the <video> tag.
<source src="/jargon/m/computer-hope.mp4"/>
</video>
Einfaches Embed-Tag
Unten ist Code für die grundlegendste Methode zum Einbetten einer Datei in eine Webseite.
Beispiel HTML-Code
<embed src="https://www.computerhope.com/issues/floppy2.avi"></embed>
In diesem Beispiel verwenden Sie das Embed-Element, um auf die Quelle der Filmdatei zu verweisen, die Sie abspielen möchten. Dieses Beispiel ist ein sehr einfaches Beispiel und zeigt keine Warnungen an. Der Benutzer wird nicht auf einen Ort zum Herunterladen eines Plug-Ins verwiesen, wenn die Videodatei nicht unterstützt wird.
Filmdatei mit dem img-Tag hinzufügen
Wenn Sie das
Beispiel HTML-Code
<img dynsrc="https://www.computerhope.com/issues/floppy2.avi" start="fileopen">
Embed-Tag zum Abspielen von QuickTime-Filmen (.MOV)
Apple QuickTime-Filmdateien sind ein weiterer beliebter Filmtyp im Internet. Nachfolgend finden Sie ein einfaches Beispiel, wie Sie diese Dateien in Ihre Webseite einbinden können.
QuickTime wird unter Microsoft Windows nicht mehr unterstützt, und alle neuen Browser unterstützen diese Methode zum Einbetten von QuickTime-Filmen nicht mehr.
Beispiel HTML-Code
<embed src="https://www.computerhope.com/issues/ibm-linux.mov" Pluginspage="https://support.apple.com/quicktime" width="320" height="250" CONTROLLER="true" LOOP="false" AUTOPLAY="false" name="IBM Video"></embed>
Im Einbettungsbeispiel verweist der erste Teil des Codes auf die Quelle (Quelle) der Filmdatei, bei der es sich um die Filmdatei selbst handelt. Als nächstes ist die Plug-in-Seite der Speicherort des Plug-ins, wenn der Besucher es nicht installiert hat. Die Breite und Höhe sind die tatsächlichen Abmessungen der Videodatei. Der Controller-Wert kann auf „true“ oder „false“ gesetzt werden, um die Anzeige der unteren Steuerelemente umzuschalten.
Möglicherweise möchten Sie die Höhe der Videodatei erhöhen, wenn Sie den Controller nicht sehen können.
Loop ist eine Einstellung dafür, wann die Datei automatisch neu beginnen soll, wenn sie fertig ist. Schließlich weist die automatische Wiedergabe den Browser an, mit der Wiedergabe der Videodatei zu beginnen oder nicht, nachdem die Seite fertig geladen wurde.
Geben Sie das Attribut für das Embed-Tag ein, um das Plug-In anzugeben
Schließen Sie im Embed-Tag das type-Attribut ein, um den MIME-Typ für die Videodatei anzugeben. Auf diese Weise können Sie das Plug-In angeben, das zum Abspielen des Videos in einem Browser erforderlich ist.
Beispiel HTML-Code
<embed src="https://www.computerhope.com/issues/floppy2.avi" type="video/x-msvideo"></embed>
Im obigen Beispiel ist das type-Attribut auf video/x-msvideo gesetzt, was der MIME-Typ für AVI-Videodateien ist.
Um den Wert zu ermitteln, der dem type-Attribut für andere Arten von Videodateien zugewiesen werden soll, überprüfen Sie die Liste der MIME-Typen für Videodateien auf der Seite IANA Media Types.
