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

属性:

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

总结

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

相关推荐
Aphasia3119 分钟前
react必备JavaScript知识点(二)——类
前端·javascript
玖玖passion11 分钟前
数组转树:数据结构中的经典问题
前端
呼Lu噜18 分钟前
WPF-遵循MVVM框架创建图表的显示【保姆级】
前端·后端·wpf
珠峰下的沙砾21 分钟前
Vue3 里 CSS 深度作用选择器 :global
前端·javascript·css
航Hang*23 分钟前
WEBSTORM前端 —— 第2章:CSS —— 第3节:背景属性与显示模式
前端·css·css3·html5·webstorm
wuhen_n24 分钟前
CSS元素动画篇:基于当前位置的变换动画(一)
前端·css·html·css3·html5
拉不动的猪41 分钟前
# 移动端与PC端全屏的处理
前端·javascript·面试
Donvink43 分钟前
【视频生成模型】通义万相Wan2.1模型本地部署和LoRA微调
人工智能·深度学习·aigc·音视频
局外人LZ1 小时前
WXT+Vue3+sass+antd+vite搭建项目开发chrome插件
前端·chrome·vue·sass
excel1 小时前
招幕技术人员
前端·javascript·后端