English | 简体中文 | 繁體中文 | Русский язык | Français | Español | Português | Deutsch | 日本語 | 한국어 | Italiano | بالعربية
L'élément <video> HTML est utilisé pour intégrer un lecteur de media dans un document HTML ou XHTML, permettant de jouer des vidéos à l'intérieur du document. Vous pouvez également utiliser l'étiquette <video> pour du contenu audio, mais l'élément <audio> pourrait être plus approprié en termes d'expérience utilisateur.
Exemple de lecture de vidéo via video :
!doctype html> <html> <head> <meta charset="UTF-8"> <title>Utilisation de la balise HTML video (Tutoriel de base du site web oldtoolbag.com)</title> </head> <body> <video controls> <source src="movie.mp4" type="video/mp4"> <source src="movie.webm" type="video/webm"> <p>Votre navigateur ne supporte pas39;t ne supporte pas HTML5 video. Voici a <a href="movie.mp4">lien vers la vidéo</a> au lieu de.</p> </video> </body> </html>Essayez de voir ‹/›
IEFirefoxOperaChromeSafari
Tous les navigateurs populaires le supportent.
La balise <video> définit une vidéo, comme un extrait de film ou un autre flux vidéo.
Actuellement, l'élément <video> prend en charge trois formats vidéo : MP4、WebM、Ogg。
| Navigateurs | MP4 | WebM | Ogg |
|---|---|---|---|
| Internet Explorer | OUI | NON | NON |
| Chrome | OUI | OUI | OUI |
| Firefox | OUI à partir de Firefox 21 dès la version système Linux à partir de Firefox 3à partir de la version | OUI | OUI |
| Safari | OUI | NON | NON |
| Opera | OUI à partir d'Opera 25 dès la version | OUI | OUI |
MP4 = MPEG 4fichier utilisant H264 codec vidéo et codec audio AAC
WebM = Fichier WebM utilisant le codec vidéo VP8 codec vidéo et codec audio Vorbis
Ogg = Fichier Ogg utilisant le codec vidéo Theora et le codec audio Vorbis
| format | MIME-type |
|---|---|
| MP4 | video/mp4 |
| WebM | video/webm |
| Ogg | video/ogg |
La balise <video> est une balise HTML5 nouvelle balise.
Avis :Il est possible de placer <video> et </Le contenu texte est placé entre les balises <video>, de sorte que les navigateurs qui ne supportent pas l'élément <video> peuvent afficher les informations de cette balise.
New : HTML5 Nouvelles propriétés ajoutées.
| Attribut | Valeur | Description |
|---|---|---|
| autoplayHTML5 | autoplay | Si cette propriété est présente, la vidéo commence à jouer dès qu'elle est prête. |
| controlsHTML5 | controls | Si cette propriété est présente, le contrôleur est affiché à l'utilisateur, par exemple le bouton de lecture. |
| heightHTML5 | pixels | Définir la hauteur du lecteur de vidéo. |
| loopHTML5 | loop | Si cette propriété est présente, le fichier média commence à nouveau à jouer après la fin de la lecture. |
| mutedHTML5 | muted | Si cette propriété est présente, la sortie audio de la vidéo est muette. |
| posterHTML5 | URL | Spécifiez l'image à afficher pendant le téléchargement de la vidéo, jusqu'à ce que l'utilisateur clique sur le bouton de lecture. |
| preloadHTML5 | auto metadata none | Si cette propriété est présente, la vidéo est chargée et préchargée au chargement de la page. Si "autoplay" est utilisé, cette propriété est ignorée. |
| srcHTML5 | URL | URL de la vidéo à lire. |
| widthHTML5 | pixels | Définir la largeur du lecteur de vidéo. |
Prise en charge <video> balise Propriétés globales HTML.
Prise en charge <video> balise Propriétés événementielles HTML.