html5插入可自动播放音频的方法

发布时间:2020-08-31 11:21:49 作者:小新
来源:亿速云 阅读:3953

小编给大家分享一下html5插入可自动播放音频的方法,相信大部分人都还不怎么了解,因此分享这篇文章给大家参考一下,希望大家阅读完这篇文章后大有收获,下面让我们一起去了解一下吧!

HTML5中的<audio>标签可以插入音频,control属性可以控制音频的播放,暂停,调节音量等。布局时可以根据需要设置音频的长width和高height。

<audio> 与 </audio>  标签里面的内容用于给不支持 audio 标签的浏览器显示的。

插入音频需要用到的相关标签的描述:

<audio> 用来设置声音内容

<source>用于设置音频的资源,一般在 <video> 与 <audio>标签中使用,可以使用多个

注意:在使用<audio>音频标签时,要注意浏览器的兼容性问题,浏览器的兼容性如下如所示:

html5插入可自动播放音频的方法

实例示范1:HTML5中怎么插入音频

实例详解:

首先创建一个<audio>标签,用于显示音频内容,然后用<source>标签引入需要插入的音频,src引入文件时要注意文件的路径,具体代码如下:

<audio controls>
  <source src="horse.mp3" type="audio/mpeg">
您的浏览器不支持 audio 元素。
</audio>

效果图:

html5插入可自动播放音频的方法

实例示范2:HTML5中怎么插入自动播放的音频

实例描述:

<audio>标签中的autoplay 属性规定一旦视频就绪马上开始播放,如果设置了该属性,视频将自动播放。且所有主流浏览器都支持 autoplay 属性。

HTML5中插入自动播放音频的方法和上面介绍的插入音频的方法一样,只是多加了一个属性,即<audio>标签中的autoplay 属性,它可以实现音频自动播放的效果,具体代码如下:

<audio controls autoplay>
  <source src="horse.mp3" type="audio/mpeg">
  您的浏览器不支持 audio 元素。
</audio>

以上是html5插入可自动播放音频的方法的所有内容,感谢各位的阅读!相信大家都有了一定的了解,希望分享的内容对大家有所帮助,如果还想学习更多知识,欢迎关注亿速云行业资讯频道!

推荐阅读:
  1. Unity游戏广播走马灯可循环可插入
  2. html5怎么实现插入视频

免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:is@yisu.com进行举报,并提供相关证据,一经查实,将立刻删除涉嫌侵权内容。

html5

上一篇:js删除数组中指定元素的方法

下一篇:详解SpringBoot中Session超时原理说明

相关阅读

您好,登录后才能下订单哦!

密码登录
登录注册
其他方式登录
点击 登录注册 即表示同意《亿速云用户服务条款》