HTML
Elementi multimediali
Ricerca…
Parametri
Attributo | Dettagli |
---|---|
larghezza | Imposta la larghezza dell'elemento in pixel. |
altezza | Imposta l'altezza dell'elemento in pixel. |
<source> | Definisce le risorse dei file audio o video |
traccia | Definisce la traccia del testo per gli elementi multimediali |
controlli | Visualizza i controlli |
riproduzione automatica | Avvia automaticamente la riproduzione del file multimediale |
ciclo continuo | Riproduce i media in un ciclo ripetuto |
smorzato | Riproduce i media senza audio |
manifesto | Assegna un'immagine da visualizzare fino a quando non viene caricato un video |
Osservazioni
Supporto nei browser
caratteristica | Cromo | Firefox (Gecko) | Internet Explorer | musica lirica | Safari |
---|---|---|---|---|---|
Supporto di base | 3.0 | 3.5 (1.9.1) | 9.0 | 10.50 | 3.1 |
<audio> : PCM in WAVE | (Sì) | 3.5 (1.9.1) | Nessun supporto | 10.50 | 3.1 |
<audio> : Vorbis in WebM | (Sì) | 4.0 (2.0) | Nessun supporto | 10.60 | 3.1 |
<audio> : Streaming Vorbis / Opus in WebM tramite MSE | ? | 36.0 | ? | ? | ? |
<audio> : Vorbis in Ogg | (Sì) | 3.5 (1.9.1) | Nessun supporto | 10.50 | Nessun supporto |
<audio> : MP3 | (Sì) | (Sì) | 9.0 | (Sì) | 3.1 |
<audio> : MP3 in MP4 | ? | ? | ? | ? | (Sì) |
<audio> : AAC in MP4 | (Sì) | (Sì) | 9.0 | (Sì) | 3.1 |
<audio> : Opus in Ogg | 27,0 | 15.0 (15.0) | ? | ? | ? |
<video> : VP8 e Vorbis in WebM | 6.0 | 4.0 (2.0) | 9.0 | 10.60 | 3.1 |
<video> : VP9 e Opus in WebM | 29,0 | 28.0 (28.0) | ? | (Sì) | ? |
<video> : Streaming WebM tramite MSE | ? | 42.0 (42.0) | ? | ? | ? |
<video> : Theora e Vorbis in Ogg | (Sì) | 3.5 (1.9.1) | Nessun supporto | 10.50 | Nessun supporto |
<video> : H.264 e MP3 in MP4 | (Sì) | (Sì) | 9.0 | (Sì) | (Sì) |
<video> : H.264 e AAC in MP4 | (Sì) | (Sì) | 9.0 | (Sì) | 3.1 |
qualsiasi altro formato | Nessun supporto | Nessun supporto | Nessun supporto | Nessun supporto | 3.1 |
Usando `
Usa l'elemento HTML o <audio>
per incorporare il contenuto video / audio in un documento. L'elemento video / audio contiene una o più sorgenti video / audio. Per specificare una fonte, utilizzare l'attributo src o l'elemento <source>
; il browser sceglierà quello più adatto.
Esempio di tag audio:
<!-- Simple video example -->
<video src="videofile.webm" autoplay poster="posterimage.jpg">
Sorry, your browser doesn't support embedded videos,
but don't worry, you can <a href="videofile.webm">download it</a>
and watch it with your favorite video player!
</video>
<!-- Video with subtitles -->
<video src="foo.webm">
<track kind="subtitles" src="foo.en.vtt" srclang="en" label="English">
<track kind="subtitles" src="foo.sv.vtt" srclang="sv" label="Svenska">
</video>
<!-- Simple video example -->
<video width="480" controls poster="https://archive.org/download/WebmVp8Vorbis/webmvp8.gif" >
<source src="https://archive.org/download/WebmVp8Vorbis/webmvp8.webm" type="video/webm">
<source src="https://archive.org/download/WebmVp8Vorbis/webmvp8_512kb.mp4" type="video/mp4">
<source src="https://archive.org/download/WebmVp8Vorbis/webmvp8.ogv" type="video/ogg">
Your browser doesn't support HTML5 video tag.
</video>
Esempio di tag audio:
<!-- Simple audio playback -->
<audio src="http://developer.mozilla.org/@api/deki/files/2926/=AudioTest_(1).ogg" autoplay>
Your browser does not support the <code>audio</code> element.
</audio>
<!-- Audio playback with captions -->
<audio src="foo.ogg">
<track kind="captions" src="foo.en.vtt" srclang="en" label="English">
<track kind="captions" src="foo.sv.vtt" srclang="sv" label="Svenska">
</audio>
Audio
HTML5 fornisce un nuovo standard per l'incorporamento di un file audio su una pagina web.
Puoi incorporare un file audio in una pagina utilizzando l'elemento <audio>
:
<audio controls>
<source src="file.mp3" type="audio/mpeg">
Your browser does not support the audio element.
</audio>
video
Puoi incorporare anche un video in una pagina web utilizzando l'elemento <video>
:
<video width="500" height="700" controls>
<source src="video.mp4" type="video/mp4">
Your browser does not support the video tag.
</video>
Intestazione o sfondo del video
Aggiunta di un video che riproduce automaticamente su un loop e non ha controlli o suoni. Perfetto per un'intestazione o uno sfondo video.
<video width="1280" height="720" autoplay muted loop poster="video.jpg" id="videobg">
<source src="video.mp4" type="video/mp4">
<source src="video.webm" type="video/webm">
<source src="video.ogg" type="video/ogg">
</video>
Questo CSS fornisce un fallback se il video non può essere caricato. Nota che è consigliato utilizzare il primo frame del video come poster video.jpg.
#videobg {
background: url(video.jpg) no-repeat;
background-size: cover;
}