HTML
Éléments multimédias
Recherche…
Paramètres
Attribut | Détails |
---|---|
largeur | Définit la largeur de l'élément en pixels. |
la taille | Définit la hauteur de l'élément en pixels. |
<source> | Définit les ressources des fichiers audio ou vidéo |
Piste | Définit la piste de texte pour les éléments multimédias |
contrôles | Affiche les commandes |
lecture automatique | Commence automatiquement à jouer les médias |
boucle | Joue le média dans un cycle répété |
en sourdine | Joue les médias sans son |
affiche | Assigne une image à afficher jusqu'à ce qu'une vidéo soit chargée |
Remarques
Prise en charge dans les navigateurs
Fonctionnalité | Chrome | Firefox (Gecko) | Internet Explorer | Opéra | Safari |
---|---|---|---|---|---|
Support de base | 3.0 | 3.5 (1.9.1) | 9.0 | 10.50 | 3.1 |
<audio> : PCM dans WAVE | (Oui) | 3.5 (1.9.1) | Pas de support | 10.50 | 3.1 |
<audio> : Vorbis dans WebM | (Oui) | 4.0 (2.0) | Pas de support | 10.60 | 3.1 |
<audio> : Streaming Vorbis / Opus dans WebM via MSE | ? | 36,0 | ? | ? | ? |
<audio> : Vorbis dans Ogg | (Oui) | 3.5 (1.9.1) | Pas de support | 10.50 | Pas de support |
<audio> : MP3 | (Oui) | (Oui) | 9.0 | (Oui) | 3.1 |
<audio> : MP3 en MP4 | ? | ? | ? | ? | (Oui) |
<audio> : AAC en MP4 | (Oui) | (Oui) | 9.0 | (Oui) | 3.1 |
<audio> : Opus dans Ogg | 27,0 | 15,0 (15,0) | ? | ? | ? |
<video> : VP8 et Vorbis dans WebM | 6,0 | 4.0 (2.0) | 9.0 | 10.60 | 3.1 |
<video> : VP9 et Opus dans WebM | 29.0 | 28,0 (28,0) | ? | (Oui) | ? |
<video> : Streaming WebM via MSE | ? | 42,0 (42,0) | ? | ? | ? |
<video> : Theora et Vorbis dans Ogg | (Oui) | 3.5 (1.9.1) | Pas de support | 10.50 | Pas de support |
<video> : H.264 et MP3 en MP4 | (Oui) | (Oui) | 9.0 | (Oui) | (Oui) |
<video> : H.264 et AAC en MP4 | (Oui) | (Oui) | 9.0 | (Oui) | 3.1 |
tout autre format | Pas de support | Pas de support | Pas de support | Pas de support | 3.1 |
Utiliser `
Utilisez l'élément HTML ou <audio>
pour incorporer du contenu vidéo / audio dans un document. L'élément vidéo / audio contient une ou plusieurs sources vidéo / audio. Pour spécifier une source, utilisez l'attribut src ou l'élément <source>
. le navigateur choisira le plus approprié.
Exemple de balise 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>
Exemple de balise 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>
l'audio
HTML5 fournit une nouvelle norme pour intégrer un fichier audio sur une page Web.
Vous pouvez incorporer un fichier audio à une page en utilisant l'élément <audio>
:
<audio controls>
<source src="file.mp3" type="audio/mpeg">
Your browser does not support the audio element.
</audio>
Vidéo
Vous pouvez également intégrer une vidéo à une page Web à l'aide de l'élément <video>
:
<video width="500" height="700" controls>
<source src="video.mp4" type="video/mp4">
Your browser does not support the video tag.
</video>
En-tête vidéo ou arrière-plan
Ajout d'une vidéo qui sera automatiquement lancée sur une boucle et qui n'a ni contrôle ni son. Parfait pour un en-tête vidéo ou un arrière-plan.
<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>
Ce CSS fournit une solution de secours si la vidéo ne peut pas être chargée. Notez qu'il est recommandé d'utiliser la première image de la vidéo comme affiche video.jpg.
#videobg {
background: url(video.jpg) no-repeat;
background-size: cover;
}