HTML - Multimedia einbetten
Manchmal müssen Sie Ihrer Webseite Musik oder Videos hinzufügen. Der einfachste Weg, Ihrer Website Video oder Sound hinzuzufügen, besteht darin, das spezielle HTML-Tag namens aufzurufen<embed>. Dieses Tag bewirkt, dass der Browser selbst Steuerelemente für das automatisch bereitgestellte Multimedia enthält, sofern der Browser das <embed> -Tag und den angegebenen Medientyp unterstützt.
Sie können auch a einschließen <noembed>Tag für die Browser, die das <embed> -Tag nicht erkennen. Sie können beispielsweise <embed> verwenden, um einen Film Ihrer Wahl anzuzeigen, und<noembed> um ein einzelnes JPG-Bild anzuzeigen, wenn der Browser das <embed> -Tag nicht unterstützt.
Beispiel
Hier ist ein einfaches Beispiel zum Abspielen einer eingebetteten MIDI-Datei:
<!DOCTYPE html>
<html>
<head>
<title>HTML embed Tag</title>
</head>
<body>
<embed src = "/html/yourfile.mid" width = "100%" height = "60" >
<noembed><img src = "yourimage.gif" alt = "Alternative Media" ></noembed>
</embed>
</body>
</html>Die <embed> -Tag-Attribute
Im Folgenden finden Sie eine Liste wichtiger Attribute, die mit dem <embed> -Tag verwendet werden können.
Note- Die Attribute " Ausrichten" und " Autostart" sind in HTML5 veraltet. Verwenden Sie diese Attribute nicht.
| Sr.Nr. | Attribut & Beschreibung |
|---|---|
| 1 | align Legt fest, wie das Objekt ausgerichtet wird. Es kann entweder auf Mitte, links oder rechts eingestellt werden . |
| 2 | autostart Dieses boolesche Attribut gibt an, ob das Medium automatisch gestartet werden soll. Sie können entweder wahr oder falsch einstellen. |
| 3 | loop Gibt an, ob der Sound kontinuierlich abgespielt werden soll (Loop auf true setzen), eine bestimmte Anzahl von Malen (ein positiver Wert) oder überhaupt nicht (false). |
| 4 | playcount Gibt an, wie oft der Sound abgespielt werden soll. Dies ist eine alternative Option für die Schleife, wenn Sie den IE verwenden. |
| 5 | hidden Gibt an, ob das Multimedia-Objekt auf der Seite angezeigt werden soll. Ein falscher Wert bedeutet nein und wahre Werte bedeuten ja. |
| 6 | width Breite des Objekts in Pixel |
| 7 | height Höhe des Objekts in Pixel |
| 8 | name Ein Name, der zum Verweisen auf das Objekt verwendet wird. |
| 9 | src URL des einzubettenden Objekts. |
| 10 | volume Regelt die Lautstärke des Tons. Kann zwischen 0 (aus) und 100 (volle Lautstärke) liegen. |
Unterstützte Videotypen
Sie können verschiedene Medientypen wie Flash-Filme (.swf), AVI- (.avi) und MOV- (.mov) Dateitypen im Embed-Tag verwenden.
.swf files - sind die Dateitypen, die vom Flash-Programm von Macromedia erstellt wurden.
.wmv files - sind die Media Video-Dateitypen von Microsoft Windows.
.mov files - sind Apples Quick Time Movie-Format.
.mpeg files - sind Filmdateien, die von der Expertengruppe für bewegte Bilder erstellt wurden.
<!DOCTYPE html>
<html>
<head>
<title>HTML embed Tag</title>
</head>
<body>
<embed src = "/html/yourfile.swf" width = "200" height = "200" >
<noembed><img src = "yourimage.gif" alt = "Alternative Media" ></noembed>
</embed>
</body>
</html>Dies führt zu folgendem Ergebnis:
Hintergrund Audio
Sie können HTML verwenden <bgsound>Tag, um einen Soundtrack im Hintergrund Ihrer Webseite abzuspielen. Dieses Tag wird nur von Internet Explorer unterstützt und die meisten anderen Browser ignorieren dieses Tag. Es lädt eine Audiodatei herunter und spielt sie ab, wenn das Hostdokument zum ersten Mal vom Benutzer heruntergeladen und angezeigt wird. Die Hintergrund-Sounddatei wird auch wiedergegeben, wenn der Benutzer den Browser aktualisiert.
Note- Das bgsound-Tag ist veraltet und soll in einer zukünftigen HTML-Version entfernt werden. Sie sollten daher nicht verwendet werden. Es wird empfohlen, HTML5-Tag-Audio zum Hinzufügen von Sound zu verwenden. In diesem Kapitel wird das bgsound-Tag jedoch noch zu Lernzwecken ausführlich erläutert.
Dieses Tag hat nur zwei Attribute loop und src . Beide Attribute haben dieselbe Bedeutung wie oben erläutert.
Hier ist ein einfaches Beispiel, um eine kleine Midi-Datei abzuspielen:
<!DOCTYPE html>
<html>
<head>
<title>HTML embed Tag</title>
</head>
<body>
<bgsound src = "/html/yourfile.mid">
<noembed><img src = "yourimage.gif" ></noembed>
</bgsound>
</body>
</html>Dies erzeugt den leeren Bildschirm. Dieses Tag zeigt keine Komponente an und bleibt verborgen.
Internet Explorer kann auch nur drei verschiedene Soundformatdateien verarbeiten - wav, das native Format für PCs; au, das native Format für die meisten Unix-Workstations; und MIDI, ein universelles Musikcodierungsschema.
HTML-Objekt-Tag
HTML 4 führt die <object>Element, das eine universelle Lösung für die generische Objekteinbeziehung bietet. Das<object> Mit element können HTML-Autoren alles angeben, was ein Objekt für die Präsentation durch einen Benutzeragenten benötigt.
Hier einige Beispiele -
Beispiel 1
Sie können ein HTML-Dokument wie folgt in ein HTML-Dokument selbst einbetten:
<object data = "data/test.htm" type = "text/html" width = "300" height = "200">
alt : <a href = "data/test.htm">test.htm</a>
</object>Hier wird das alt- Attribut angezeigt, wenn der Browser das Objekt- Tag nicht unterstützt .
Beispiel - 2
Sie können ein PDF-Dokument wie folgt in ein HTML-Dokument einbetten:
<object data = "data/test.pdf" type = "application/pdf" width = "300" height = "200">
alt : <a href = "data/test.pdf">test.htm</a>
</object>Beispiel - 3
Sie können einige Parameter für das Dokument mit dem angeben <param>Etikett. Hier ist ein Beispiel zum Einbetten einer WAV-Datei:
<object data = "data/test.wav" type = "audio/x-wav" width = "200" height = "20">
<param name = "src" value = "data/test.wav">
<param name = "autoplay" value = "false">
<param name = "autoStart" value = "0">
alt : <a href = "data/test.wav">test.wav</a>
</object>Beispiel - 4
Sie können ein Flash-Dokument wie folgt hinzufügen:
<object classid = "clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" id = "penguin"
codebase = "someplace/swflash.cab" width = "200" height = "300">
<param name = "movie" value = "flash/penguin.swf" />
<param name = "quality" value = "high" />
<img src = "penguin.jpg" width = "200" height = "300" alt = "Penguin" />
</object>Beispiel - 5
Sie können ein Java-Applet wie folgt zum HTML-Dokument hinzufügen:
<object classid = "clsid:8ad9c840-044e-11d1-b3e9-00805f499d93"
width = "200" height = "200">
<param name = "code" value = "applet.class">
</object>Das classidDas Attribut gibt an, welche Version des Java-Plug-Ins verwendet werden soll. Mit dem optionalen Codebasisattribut können Sie angeben, ob und wie die JRE heruntergeladen werden soll.