学生HTML网页设计添加插入背景音乐的简单代码

多HTML网页设计课程作业要求给页面添加背景音乐,今天给大家讲解下常用的网页插入音乐的简单标签。另附示例代码、使用说明及标签说明,用的到的同学直接复制代码即可使...

多HTML网页设计课程作业要求给页面添加背景音乐,今天给大家讲解下常用的网页插入音乐的简单标签。另附示例代码、使用说明及标签说明,用的到的同学直接复制代码即可使用。

网页背景音乐<embed>标签

使用说明:

<embed>标签需要写在顶部</head>上方,title标签下面。

代码示例:

<embed src="music/音乐.mp3" hidden="flase" autostart="true" loop="true">

标签说明:

· src="" 在引号内添加写音乐文件路径。

· hidden="true"表示隐藏音乐播放按钮;hidden="false"表示开启音乐播放按钮。

· autostart="true" 表示是打开网页加载完后自动播放。

· loop="true"表示 循环播放;loop="false"表示仅播放一次。

网页背景音乐<audio>标签

使用说明:

<audio>标签一般在正文</body>内即可。同时可配合CSS隐藏播放器。

代码示例:

<audio autoplay="autoplay" loop="loop" preload="auto" controls="controls" src="music/音乐.mp3">       

</audio>

标签说明:

· src="" 在引号内添加写音乐文件路径。

· autoplay="autoplay",则背景音乐将在音网页打开后就自动马上播放。

· controls="controls",则为了在页面内显示显示控件,如播放按钮。

· "loop="loop",则是为了是背景音乐重复播放。

· preload="auto",则音频在页面加载的同时进行加载,并预备播放。

隐藏播放器:

若是想播放按钮隐藏,直接使用css 的display控制audio标签的显示。

<style type="text/css">

 audio{display: none; }

</style>