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;
}


Modified text is an extract of the original Stack Overflow Documentation
Sous licence CC BY-SA 3.0
Non affilié à Stack Overflow