如何用HTML写代码实现自动播放音乐

html-css07

如何用HTML写代码实现自动播放音乐,第1张

由于浏览器的安全策略问题,现在已经不再支持打开页面自动播放音乐了,如需要播放还是要让用户点击播放才可以,可以使用html5的audio标签加载音乐播放。

<audio src="https://lanye.org/demo.mp3" controls width="100%"></audio>

首先,HTML5所定义的audio元素支持3种音频格式。分别是Ogg Vorbis、MP3、Wav。其中Ogg Vorbis支持Firefox 3.5、Opera 10.5、Chrome 3.0。MP3支持IE 9、Chrome 3.0、Safari 3.0。Wav支持Firefox 3.5、Opera 10.5、Safari 3.0。

它们是这样工作的,如果要HTML5当中播放音频代码如下:<audio src="song.ogg" controls="controls"></audio>

代码中:src="音频文件路径"(其中.ogg文件所支持的浏览器上面有所提),control 属性供添加播放、暂停和音量控件,<audio>与 </audio>之间插入的内容是供不支持 audio 元素的浏览器显示的。

对于音频的属性控制,我们需要<audio>标签的属性。autoplay属性:值“autoplay”。如果出现该属性,则音频在就绪后马上播放。controls属性:值“controls”。如果出现该属性,则向用户显示控件,比如播放按钮。loop属性:值“loop”。如果出现该属性,则每当音频结束时重新开始播放。preload属性:值“preload”。如果出现该属性,则音频在页面加载时进行加载,并预备播放。如果使用 "autoplay",则忽略该属性。src属性:值“url”。要播放的音频的 URL。

<audio>元素的优点在于:素能够播放声音文件或者音频流。改变了传统的音频在web上的播放观念,不再通过插件(如FLASH)来播放。规定了通过audio元素来包含音频的标准方法。使网页上的音频播放标准化。