English | 简体中文 | 繁體中文 | Русский язык | Français | Español | Português | Deutsch | 日本語 | 한국어 | Italiano | بالعربية
HTML <video> est applicable à HTML 5+, utilisé pour définir des flux de médias vidéo à visionner en ligne.
Beaucoup de sites utilisent des vidéos. HTML5 Fournit des normes pour afficher des vidéos.
Jusqu'à présent, il n'existe pas de norme visant à afficher des vidéos sur les pages web.
Aujourd'hui, la plupart des vidéos sont affichées via des plug-ins (comme Flash). Cependant, tous les navigateurs ne possèdent pas les mêmes plug-ins.
HTML5 Définit une méthode standard pour inclure des vidéos à l'aide de l'élément video.
Internet Explorer 9+, Firefox, Opera, Chrome et Safari prennent en charge l'élément <video>.
Attention : Internet Explorer 8 Ou des versions d'IE plus anciennes ne prennent pas en charge l'élément <video>.
Pour utiliser le HTML5 Pour afficher un vidéo dans le, tout ce que vous avez besoin est :
<video width="320" height="240" controls> <source src="movie.mp4" type="video/mp4"> <source src="movie.ogg" type="video/ogg"> Votre navigateur ne prend pas en charge la balise Video. </video>Testez pour voir ‹/›
En même temps, l'élément <video> fournit également les propriétés width et height pour contrôler la taille du vidéo. Si la hauteur et la largeur sont définies, l'espace vidéo nécessaire sera réservé au moment du chargement de la page. Si ces propriétés ne sont pas définies, le navigateur ne sait pas quelle taille de vidéo est nécessaire, il ne peut pas réserver d'espace spécifique lors du chargement, et la page peut changer de taille en fonction de la taille originale du vidéo.
<video> et</Le contenu inséré entre les balises <video> est destiné aux navigateurs qui ne prennent pas en charge l'élément video.
L'élément <source> peut être utilisé pour lier différents fichiers vidéo. Le navigateur utilisera le premier format reconnu :
Actuellement, l'élément <video> prend en charge trois formats vidéo : MP4, WebM et Ogg:
Navigateur | MP4 | WebM | Ogg |
Internet Explorer | YES | NO | NO |
Chrome | YES | YES | YES |
Firefox | YES | YES | YES |
Safari | YES | NO | NO |
Opera | YES (à partir d'Opera 25 ) | YES | YES |
MP4 = Fichier avec H.264 MPEG avec le codage vidéo et le codage audio AAC 4 fichier
WebM = Fichier avec VP8 Fichier WebM avec le codage vidéo et le codage audio Vorbis
Ogg = Fichier Ogg avec le codage vidéo Theora et le codage audio Vorbis
Format | MIME-type |
MP4 | video/mp4 |
WebM | video/webm |
Ogg | video/ogg |
HTML5 Les éléments <video> et <audio> possèdent également des méthodes, des propriétés et des événements.
Les méthodes, les propriétés et les événements des éléments <video> et <audio> peuvent être contrôlés à l'aide de JavaScript.
Les méthodes sont utilisées pour la lecture, la pause et le chargement, etc. Les propriétés (comme la durée, le volume, etc.) peuvent être lues ou définies. Les événements DOM peuvent vous informer, par exemple, que l'élément <video> commence à jouer, est en pause, s'est arrêté, etc.
Les méthodes simples de l'exemple nous montrent comment utiliser l'élément <video>, lire et définir des attributs, et comment appeler des méthodes.
Créer une lecture simple de vidéo/Contrôle de pause et de taille :
Les exemples ci-dessus appellent deux méthodes : play() et pause(). Ils utilisent également deux attributs : paused et width.
Pour plus d'informations, voir HTML5 Audio/Guide de référence DOM Video.
Balise | Description |
<video> | Défini une vidéo |
<source> | Défini plusieurs ressources de média, telles que <video> et <audio> |
<track> | Défini dans la piste de texte du lecteur de média |