本文介绍了在HTML中添加背景音乐的两种方法，一种是通过标签，支持自动播放和循环播放；另一种是使用bgsound标签（非标准做法且只在老版本IE浏览器中使用），由于不同浏览器的策略差异以及移动设备的限制，推荐使用标签并配合JavaScript进行更精细的控制来实现音乐播放，同时文章还提到了如何在网页上添加图片与背景音乐的方法，包括设置背景图像和使用img及audio标签插入图片和音乐的具体代码示例，确保所有资源已正确上传并指向正确的URL路径是关键步骤。
怎么用HTML插入背景音乐？
在HTML中，我们可以通过<audio>标签来插入背景音乐，这个标签支持自动播放和循环播放的特性，同时还有一些其他属性可以控制音乐的播放行为,以下是基本用法：
使用<audio>标签嵌入音频文件
<audio autoplay loop controls src="music.mp3"> 您的浏览器不支持 audio 元素。 </audio>
src: 指定音频文件的路径（如src=“music.mp3”）。autoplay: 页面的内容加载完成后立即开始播放声音（但请注意大多数现代浏览器的策略会阻止或限制自动播放以提升用户体验）。loop: 当当前音频结束时重新开始播放。controls: 提供默认的播放控件（即播放/暂停按钮、音量控制等）给用户。
HTML代码内设置背景音乐教程
如果你想直接在HTML代码里设定背景音乐，可以使用bgsound标签（尽管这并非标准做法且只在老版本的IE浏览器中得到支持）：
<bgsound src="your_music_file.mid" loop="-1" autostart="true">
这里的参数解释如下：
src: 背景音乐文件地址。loop: 设置播放次数，“-1”表示无限次循环。autostart: 表示音乐是否自动播放,真为是假为否。
注意: 由于不同浏览器对自动播放的策略有所不同，所以实际效果可能会有所差异，对于更现代的网页开发，推荐使用<audio>标签并配合JavaScript进行更为精细的控制。
在手机上播放背景音乐的方法
针对移动设备尤其是Android设备，你可以继续使用<audio>标签并通过JavaScript触发play动作来实现自动播放（如果符合相关政策的话），而对于iOS系统由于隐私政策和能源消耗考虑通常不允许页面自动播放音频除非有用户的交互操作作为前提条件,因此需要结合JavaScript监听用户事件比如点击然后才去执行播放命令。
如何在网页添加图片与背景音乐?
要同时在网页上添加图片和背景音乐, 你只需将相应的HTML标记放在页面的合适位置即可。
<!DOCTYPE html>
<html lang="zh">
<head>
<!-- 其他头部信息 -->
<body style="background: url('image.jpg') no-repeat center center fixed; -webkit-background-size: cover;"> <!-- 这里设置了背景图像 -->
<img src="my_picture.png" alt="My Image"> <!-- 这里插入了图片 -->
<audio id="myAudio" preload="auto" autoplay="" onended="this.currentSrc = this.currentSrc;" loop=""> <!-- 这里嵌入了背景音乐 -->
<source src="song.mp3" type="audio/mpeg"></source> <!-- 请替换成你的MP3链接 -->
</audio> <!-- 注意这里使用了autoplay以及onended来回环播放 --> </body></html> ```这样你就可以在一个网页上既看到图片又听到背景音乐了，当然还需要确保所有资源(包括图片和音乐)都已正确上传到服务器或者本地目录并且URL指向正确的路径。
