使用标签嵌入音频需设置src和controls属性，推荐用提供mp3、ogg等多格式回退，并添加autoplay、muted、loop、preload等控制属性及无障碍文本提示。
直接用 <audio></audio> 标签就能在网页里嵌入原生音频，不需要额外 JS 或插件。关键是要设置好 src 和 controls，再考虑兼容性与用户体验细节。
基础写法：必须加 controls 才能操作
只写 <audio src="music.mp3"></audio> 是无效的——音频不会显示，用户也无法播放。必须加上 controls 属性，浏览器才会渲染出播放按钮、进度条和音量滑块：
<audio src="song.mp3" controls></audio>-
src可以是相对路径（如"audio/intro.wav"）或绝对 URL（如"https://example.com/audio/clip.ogg"） -
controls是布尔属性，写上即生效，不用写controls="true"
多格式兼容：用 source 提供 fallback
不同浏览器对音频格式支持不一。MP3 兼容性最好，但仅靠 MP3 不够稳妥。推荐用 <source></source> 按优先级列出多个格式，浏览器会从上到下尝试加载第一个它能播的：
- MP3（
type="audio/mpeg"）：所有现代浏览器都支持 - OGG（
type="audio/ogg"）：Firefox、Chrome 支持好，适合开源项目 - WAV（
type="audio/wav"）：无压缩，音质好但体积大，适合短提示音 - 示例写法：
常用控制属性怎么用
这些属性都是布尔型（有就生效），按需添加即可：
-
autoplay：页面加载后自动开始播放 —— 但多数浏览器会阻止有声自动播放，除非同时加muted -
muted：静音播放，常配合autoplay实现背景音乐无声启动 -
loop：循环播放，适合环境音、BGM 或提示音 -
preload：控制预加载行为，值可选"none"（不预载）、"metadata"（只载时长等信息）、"auto"（全文件预载，慎用于大文件）
旧浏览器兜底和可访问性
<audio></audio> 标签内部的纯文本内容，会在不支持该标签的老旧浏览器中显示出来，比如 IE8 及更早版本：
- 这段文字也服务于屏幕阅读器，属于基础无障碍支持
- 建议写成明确提示，例如：“点击下方播放器收听本期播客”或“本页音频需浏览器支持 HTML5”
- 避免留空或只写“不支持”，应兼顾功能说明与替代方案（如提供下载链接）
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
