HTML - Incorpora multimedia
A volte è necessario aggiungere musica o video nella tua pagina web. Il modo più semplice per aggiungere video o audio al tuo sito web è includere il tag HTML speciale chiamato<embed>. Questo tag fa in modo che il browser stesso includa i controlli per il multimediale fornito automaticamente che il browser supporti il tag <embed> e il tipo di supporto specificato.
Puoi anche includere un file <noembed>tag per i browser che non riconoscono il tag <embed>. Potresti, ad esempio, usare <embed> per visualizzare un film a tua scelta e<noembed> per visualizzare una singola immagine JPG se il browser non supporta il tag <embed>.
Esempio
Ecco un semplice esempio per riprodurre un file midi incorporato:
<!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>Gli attributi del tag <embed>
Di seguito è riportato l'elenco degli attributi importanti che possono essere utilizzati con il tag <embed>.
Note−Gli attributi di allineamento e avvio automatico deprecati in HTML5. Non utilizzare questi attributi.
| Suor n | Attributo e descrizione |
|---|---|
| 1 | align Determina come allineare l'oggetto. Può essere impostato al centro, a sinistra oa destra . |
| 2 | autostart Questo attributo booleano indica se il supporto deve essere avviato automaticamente. Puoi impostarlo vero o falso. |
| 3 | loop Specifica se il suono deve essere riprodotto continuamente (imposta loop su true), un certo numero di volte (un valore positivo) o per niente (false) |
| 4 | playcount Specifica il numero di volte per riprodurre il suono. Questa è un'opzione alternativa per il ciclo se stai usando IE. |
| 5 | hidden Specifica se l'oggetto multimediale deve essere visualizzato nella pagina. Un valore falso significa no e valori veri significa sì. |
| 6 | width Larghezza dell'oggetto in pixel |
| 7 | height Altezza dell'oggetto in pixel |
| 8 | name Un nome utilizzato per fare riferimento all'oggetto. |
| 9 | src URL dell'oggetto da incorporare. |
| 10 | volume Controlla il volume del suono. Può essere compreso tra 0 (disattivato) e 100 (volume massimo). |
Tipi di video supportati
Puoi utilizzare vari tipi di file multimediali come i filmati Flash (.swf), i tipi di file AVI (.avi) e MOV (.mov) all'interno del tag embed.
.swf files - sono i tipi di file creati dal programma Flash di Macromedia.
.wmv files - sono i tipi di file Media Video di Microsoft Windows.
.mov files - sono il formato Quick Time Movie di Apple.
.mpeg files - sono file di filmati creati dal Moving Pictures Expert Group.
<!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>Questo produrrà il seguente risultato:
Audio di sottofondo
Puoi usare HTML <bgsound>tag per riprodurre una colonna sonora in sottofondo della tua pagina web. Questo tag è supportato solo da Internet Explorer e la maggior parte degli altri browser ignora questo tag. Scarica e riproduce un file audio quando il documento host viene scaricato per la prima volta dall'utente e visualizzato. Il file audio di sottofondo verrà riprodotto anche ogni volta che l'utente aggiorna il browser.
Note- Il tag bgsound è deprecato e dovrebbe essere rimosso in una futura versione di HTML. Quindi non dovrebbero essere usati piuttosto, si consiglia di utilizzare l'audio del tag HTML5 per aggiungere il suono. Ma sempre a scopo di apprendimento, questo capitolo spiegherà in dettaglio il tag bgsound.
Questo tag ha solo due attributi loop e src . Entrambi questi attributi hanno lo stesso significato come spiegato sopra.
Ecco un semplice esempio per riprodurre un piccolo file midi:
<!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>Questo produrrà lo schermo vuoto. Questo tag non mostra alcun componente e rimane nascosto.
Internet Explorer può anche gestire solo tre diversi file in formato audio: wav, il formato nativo per PC; au, il formato nativo per la maggior parte delle workstation Unix; e MIDI, uno schema di codifica musicale universale.
Tag oggetto HTML
HTML 4 introduce il <object>elemento, che offre una soluzione per tutti gli usi all'inclusione di oggetti generici. Il<object> L'elemento consente agli autori HTML di specificare tutto ciò che è richiesto da un oggetto per la sua presentazione da parte di un programma utente.
Ecco alcuni esempi:
Esempio 1
Puoi incorporare un documento HTML in un documento HTML stesso come segue:
<object data = "data/test.htm" type = "text/html" width = "300" height = "200">
alt : <a href = "data/test.htm">test.htm</a>
</object>Qui l' attributo alt verrà visualizzato se il browser non supporta il tag oggetto .
Esempio - 2
È possibile incorporare un documento PDF in un documento HTML come segue:
<object data = "data/test.pdf" type = "application/pdf" width = "300" height = "200">
alt : <a href = "data/test.pdf">test.htm</a>
</object>Esempio: 3
È possibile specificare alcuni parametri relativi al documento con il file <param>etichetta. Ecco un esempio per incorporare un file wav:
<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>Esempio: 4
Puoi aggiungere un documento Flash come segue:
<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>Esempio: 5
Puoi aggiungere un'applet java nel documento HTML come segue:
<object classid = "clsid:8ad9c840-044e-11d1-b3e9-00805f499d93"
width = "200" height = "200">
<param name = "code" value = "applet.class">
</object>Il classidl'attributo identifica la versione del plug-in Java da utilizzare. È possibile utilizzare l' attributo codebase opzionale per specificare se e come scaricare JRE.