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

属性:

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

总结

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

相关推荐
Dshaw4 小时前
抖音去水印下载:支持视频与图集
音视频
2601_962100734 小时前
2026年财报数据动画制作教程:财报图解转视频的完整流程
音视频
DevOpenClub4 小时前
Markdown、HTML 和 PPT 如何稳定交付:文档转换任务的幂等发布流程
开发语言·前端·c#·html·powerpoint
DevOpenClub4 小时前
网页证据如何长期复核:快照、静态 HTML 与 PDF 归档链路
前端·pdf·html
Canace5 小时前
基于 Codex Agent Harness 套壳实现自己的 AI 产品:Agent 运行时与任务编排实践
前端·人工智能·agent
天天进步20155 小时前
Pixelle-Video 源码解析 #15:AI 视频片段生成:从静态配图到动态短视频
人工智能·音视频
美狐美颜SDK开放平台5 小时前
直播APP开发核心功能详解:美颜SDK、音视频、礼物等功能成本怎么计算?
android·人工智能·计算机视觉·音视频·直播美颜sdk
星栈独行5 小时前
自定义 UI-UX-Pro-Max 的 CSV 知识库,把 AI 生成的后台拉回行业该有的样子
前端·人工智能·ui·ux
hunterandroid5 小时前
[Android 从零到一] APK 体积优化实战:从 50MB 到 15MB 的瘦身之旅
android·前端
Coodor5 小时前
在前端如何转换IC卡卡号格式
前端·javascript·nfc·卡号格式