Balise HTML <video>

Définition et utilisation

<video> L'étiquette est utilisée pour insérer du contenu vidéo dans un document, par exemple des extraits de films ou d'autres flux vidéo.

<video> L'étiquette contient une ou plusieurs sources vidéo différentes. Étiquette <source>. Le navigateur choisira la première source qu'il prend en charge.

<video> et </video> Le texte entre les étiquettes ne s'affichera que si le navigateur ne prend pas en charge <video> Affiché dans le navigateur des éléments.

HTML prend en charge trois formats vidéo : MP4, WebM et OGG.

Navigateur MP4 WebM Ogg
Edge Supporté Supporté Supporté
Chrome Supporté Supporté Supporté
Firefox Supporté Supporté Supporté
Safari Supporté Supporté Non supporté
Opera Supporté Supporté Supporté

Voir également :

Manuel de référence HTML DOM :Manuel de référence du DOM Audio/Video HTML

Exemple

Lecture de la vidéo :

<video width="640" height="360" controls>
  <source src="shanghai.mp4" type="video/mp4">
  <source src="shanghai.ogg" type="video/ogg">
  Votre navigateur ne prend pas en charge l'étiquette vidéo.
</video>

Essayez-le vous-même

Astuce et commentaires

Astuce :Pour les fichiers audio, voir l'étiquette <audio>.

Attribut optionnel

Attribut Valeur Description
autoplay autoplay Définir si la vidéo doit commencer immédiatement après qu'elle soit prête.
controls controls Définir les contrôles vidéo à afficher (par exemple, les boutons de lecture/pause, etc.).
height Pixels Définir la hauteur du lecteur de vidéo.
loop loop Définir si la vidéo doit redémarrer à chaque fin.
muted muted Définir si l'audio de la vidéo doit être désactivé.
poster URL Définir l'image à afficher pendant le téléchargement de la vidéo ou avant que l'utilisateur n' clique sur le bouton de lecture.
preload
  • auto
  • metadata
  • none
 Définir si la vidéo doit être chargée ou comment elle doit être chargée lors du chargement de la page.
src URL Définir l'URL du fichier vidéo.
width Pixels Définir la largeur du lecteur de vidéo.

Attributs globaux

<video> Les balises prennent également en charge Attributs globaux dans HTML.

Attributs d'événement

<video> Les balises prennent également en charge Attributs d'événement dans HTML.

Réglages CSS par défaut

Aucune.

Prise en charge du navigateur

Les numéros dans le tableau indiquent la version du navigateur qui prend en charge cette propriété pour la première fois.

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
4.0 9.0 3.5 3.1 11.5