html 音频和视频组件

一、音频和视频组件

音频组件名:audio

视频组件名:video

都需要 src 属性用于指定资源的来源或位置。

如果仅仅使用src路径之外,不添加controls属性,则无法进行播放,需要添加controls属性

音频和视频共有的属性:

  • src 属性用于指定资源的来源或位置。
  • controls: 显示控件,比如播放按钮。
  • autoplay: 视频在就绪后马上播放。
  • loop: 当媒介文件完成播放后再次开始播放。
  • muted: 视频的音频输出应该被静音。
  • preload: 规定是否在页面加载后载入音频。
    • none - 表示不应该预加载媒体文件。浏览器将仅加载元数据(例如时长、尺寸和文本轨道)。
    • metadata - 表示仅预加载媒体的元数据。
    • auto - 表示浏览器应该预加载它认为必要的媒体内容。这通常是整个文件,但浏览器可能会根据网络状态、用户偏好等因素做出不同的决策。

注意:要使用静音muted 才可以使用autoplay,否则无法autoplay

除了一种特殊情况:就是你的媒体参与度过高,这样即时不使用muted,也可以只使用autoplay自动播放

媒体参与度查看地址:chrome://media-engagement

二、视频封面设置

视频组件还有一个比较特殊的属性

  • poster属性指定在视频加载和播放之前显示的图像
相关推荐
音视频牛哥6 小时前
国产化最后一公里:鸿蒙 NEXT 低延迟音视频技术方案破局之路
音视频·harmonyos·鸿蒙next·鸿蒙rtmp播放器·鸿蒙rtsp播放器·鸿蒙next rtsp播放器·鸿蒙next rtmp播放器
EasyDSS7 小时前
私有化音视频系统/视频高清点播直播EasyDSS如何解锁文旅行业数字化传播新路径
音视频
苏黎caius10 小时前
SoX 语句,音频界的瑞士军刀
音视频
v1326656236810 小时前
博通集成:BK7259 wifi6音视频芯片 200w视频流IPC 超低功耗
物联网·音视频·低功耗·ipc
v1326656236812 小时前
博通集成:BK7259 支持200w视频流IPC 带ISP 硬件H264编解码 本地算力0.1T
物联网·音视频·ipc·ai边缘
纳祥科技13 小时前
拆解一款AUX立体声音频切换器,4进1出,乐器/便携效果器均可用
音视频
weixin_4434785113 小时前
Flutter学习之第三方组件:视频播放器控件
学习·flutter·音视频
EasyCVR13 小时前
GB28181/RTSP/ONVIF/RTMP/SDK视频汇聚平台EasyCVR构建通信基站智慧安防可视化管理体系
音视频
日光明媚13 小时前
FFmpeg 视频生成推理 Pipeline:Python 版常用函数封装(可直接集成)
python·深度学习·ai作画·aigc·音视频
v1326656236814 小时前
BK7258 wifi6音视频soc芯片应用分析
嵌入式硬件·物联网·音视频·iot·wifi6