Maison > interface Web > Tutoriel H5 > le corps du texte

Explication détaillée des nouvelles balises multimédia en HTML5

藏色散人
Libérer: 2022-08-05 16:10:50
avant
3296 Les gens l'ont consulté

Cet article vous présentera les balises multimédia couramment utilisées en HTML et les nouvelles balises multimédia en HTML5. J'espère qu'il sera utile aux amis dans le besoin !

Nouvelles balises multimédia HTML5

1 : Vidéo <video><video>

当前<video>元素支持三种视频格式:尽量使用MP4格式

浏览器 MP4 WebM Ogg
IE YES NO NO
Chrome YES YES YES
Firefox YES 从Firefox21版本开始Linux系统从Firefox 30开始 YES YES
Safari YES NO NO
Opera YES 从Opera25版本开始 YES YES
<video controls="controls" autoplay="autoplay" muted="muted" width="500px" height="400px" loop="loop" poster="images/tudou.jpg" preload="none">
    <source src="medio/mov_bbb.mp4">
    <source src="medio/mov_bbb.ogg">
    您的浏览器暂不支持<video>标签播放视频</video>
Copier après la connexion

视频<video>——常见属性

属性描述
autoplayautoplay视频就绪自动播放(谷歌浏览器需添加muted来解决自动播放问题)
controlscontrols向用户显示播放控件
widthpixels(像素)设置播放器宽度
heightpixels(像素)播放器高度
looploop循环播放
srcurl视频url地址
posterimageurl加载等待的话面图片
mutedmuted静音播放

二:音频<audio>

L'élément <video> actuel prend en charge trois formats vidéo : essayez d'utiliser le format MP4NavigateurMP4WebMOggIEOUINONNONChromeOUI OUIOUIFirefox OUI démarre à partir de la version Firefox21 Système Linux à partir de Firefox 30OUIOUISafariOUINONNONOperaOUI à partir de la version Opera25 OUIOUI

<!DOCTYPE html>
<html lang="en">
<head>
   <meta charset="UTF-8">
   <title>HTML5音频标签</title></head><body>
   <audio controls="controls" autoplay="autoplay" muted="muted" loop="loop">
   <source src="medio/music.mp3" type="audio/mpeg">
   您的浏览器不支持audio元素</audio>
   </body>
   </html>
Copier après la connexion
video<video> - attributs communspropertyautoplayVideo ready pour jouer automatiquement (Google Chrome doit être ajouté en sourdine à résoudre le problème de lecture automatique). pixels (pixels) hauteur du joueur ajouter des images de mots en attentemuet muet Lecture muetteDeux : Audio Internet Explorer 9+ OUISafari 5 +OUIOUI NONOpéra 10+OUIOUI

OUI

    rrreee
  • Google Chrome désactive la lecture automatique audio et vidéo
  • Propriétés
  • Valeur
  • Description

🎜lecture automatique🎜🎜lecture automatique🎜🎜Lecture automatique🎜🎜🎜🎜 contrôles🎜🎜contrôles🎜🎜Afficher les contrôles de lecture à l'utilisateur🎜🎜🎜🎜loop 🎜🎜loop🎜🎜Lecture en boucle🎜🎜🎜🎜 src🎜🎜url🎜🎜URL de la vidéo🎜🎜🎜🎜mut ed🎜🎜muted🎜🎜Jeu muet🎜 🎜🎜🎜🎜🎜Résumé des balises multimédia🎜🎜🎜🎜L'utilisation des balises audio et vidéo est fondamentalement la même🎜 🎜La prise en charge du navigateur varie 🎜🎜Google Chrome désactive la lecture automatique de l'audio et de la vidéo🎜🎜Nous pouvons ajouter l'attribut muet à balise vidéo pour couper la vidéo, mais l'audio ne peut pas (peut être résolu via JavaScript)🎜🎜La balise vidéo est le point clé, nous configurons souvent la lecture automatique, non applicable aux contrôles de contrôle, à la boucle et à la définition des attributs de taille🎜🎜🎜[Connexe recommandations : 🎜tutoriel vidéo CSS🎜]🎜

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Étiquettes associées:
source:jianshu.com
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal