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模式的音频。

属性:

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

总结

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

相关推荐
麦麦麦当劳大王4 小时前
【油猴脚本】Boss直聘 岗位职责复制
开发语言·前端·javascript
小lu飞5 小时前
2026小红书小工具怎么制作:纯前端 ZIP 打包、沙箱限制与笔记挂载流程
前端·笔记·ai·ai编程
smallcelebration5 小时前
151 从0开始搭建后端项目
前端·firefox
wangruofeng5 小时前
手机和电脑传文件,除了微信还有 LocalSend
前端
excel6 小时前
基于 GPT 的自动发布文章接口方案:从一句话或一张图片生成并发布内容
前端·javascript·后端
其实防守也摸鱼8 小时前
个人学习 Pwn 思路:从基础到漏洞利用的进阶路径
大数据·前端·人工智能·chrome·算法·安全·网络安全
朱涛的自习室8 小时前
212 个需求、22 万行代码:Agent 接管开源项目的 19 天
android·前端·人工智能
aZhe的全栈知识分享9 小时前
AI 还原 Figma 效果总达不到预期?先别急着让它写代码
前端·后端·面试
review445439 小时前
Codex Hooks 入门实战:生命周期事件、matcher 与5分钟跑通一个钩子
前端·agent·vibecoding
函数小陈9 小时前
阿里云部署DSH与RAM完成运维
前端·后端