html实现网页插入音频

前言

欢迎来到我的博客

个人主页:北岭敲键盘的荒漠猫-CSDN博客

本文主要介绍html中

如何插入音乐和视频

视频插入

标签:<video></video>

兼容格式:mp4,因为别的浏览器都有不兼容的格式,唯一对mp4全都兼容。所以尽量使用mp4格式。

属性:

属性 属性值 作用
autoplay autoplay 自动播放(谷歌必须添加muted才能自动播放)
width px 设置播放器宽度
height px 设置播放器高度
loop loop 循环播放
controls controls 显示播放的控制按钮
src 地址 视频资源位置
muted muted 静音播放
preload auto(早加载视频) none(慢加载) 用来提高网页加载速度优化体验的
poster imgurl 加载等待画面的图片

音频插入

标签:<audio></audio>

兼容描述:mp3格式所有浏览器都兼容,尽量用mp3模式的音频。

属性:

但是也会遇到浏览器禁止播放的问题,因为谷歌不让进去自己播放,咱总不能给音乐一个静音播放吧。

总结

这个确实是比较简单,就俩标签,我就不上案例了,写两下就会了。

相关推荐
卿·静几秒前
Node.js对接即梦AI实现“千军万马”视频
前端·javascript·人工智能·后端·node.js
Mintopia14 分钟前
🚀 Next.js 全栈 Web Vitals 监测与 Lighthouse 分析
前端·javascript·全栈
Mintopia16 分钟前
🤖 AIGC + CMS:内容管理系统智能化的核心技术支撑
前端·javascript·aigc
HelloGitHub19 分钟前
这款开源调研系统越来越“懂事”了
前端·开源·github
whysqwhw23 分钟前
hippy的主要原理
前端
子兮曰25 分钟前
🚀95%的前端开发者都踩过坑:JavaScript循环全解析,从基础到高阶异步迭代
前端·javascript·性能优化
2401_8534068825 分钟前
Tdesign-React 组件 Card 实现头部固定,内容区单独可滚动
前端·react.js·tdesign
蓝倾97628 分钟前
小红书获取用户作品列表API接口操作指南
java·服务器·前端·python·电商开放平台·开放api接口
小桥风满袖29 分钟前
极简三分钟ES6 - 数值的扩展
前端·javascript
北辰alk29 分钟前
React 组件间数据共享全方位指南:从 Props 到状态管理
前端