HTML浅析——audio标签以及audio标签
基础
- audio 标签用来向页面引入一个外部音频文件
- 音视频文件引入时，默认情况下不允许用户自己控制播放停止
属性：
- src：指定要引入的音视频的路径，这个是必须写
- controls：是否允许用户控制播放 不用赋值
如果声明了该属性，浏览器将提供一个包含声音，播放进度，播放暂停的控制面板，让用户可以控制音频的播放 - autoplay：音频文件是否自动播放
如果设置了autoplay，则音乐在打开页面时会自动播放
但是目前来讲大部分浏览器都不会自动对音乐进行播放 - loop 控制音乐是否循环
<audio sec = "音频地址" aotuplay = "aotuplay" controls loop> </audio>
- preload属性
预加载音频，但是需要注意preload和autoplay相冲，如果设置了autoplay属性，那么preload属性就会失效 - muted属性：让音频静音
进阶应用
这里是跟后面学习的js有关，差不多就是做一个类似于音乐播放器的播放条，这里的话我后面会出一期专门写播放条给大家看，会尽快！
这里用到的有：
- currentTime
读取 currentTime 属性将返回一个双精度浮点值，用以标明以秒为单位的当前音频的播放位置。如果音频的元数据暂时无法访问——这意味着你无法的知道媒体的开始或持续时间。这时，currentTime 相对应的，能够被用于改变重播的时间。否则，设置 currentTime 将设置当前的播放位置，并且会自动搜寻到媒体的那个位置，如果媒体目前已经被加载的话。 - duration 只读
这是一个双精度浮点数，指明了音频在时间轴中的持续时间（总长度），以秒为单位。如果元素上没有媒体，或者媒体是不可用的，那么会返回 NaN。如果媒体找不到确切的结尾（比如不确定长度的直播流，网络电台，或者是通过 WebRTC 连接的流），那么这个值将返回 +Infinity。 - audio的一些事件
canplay（）：浏览器已经可以播放媒体，但是预测已加载的数据不足以在不暂停的情况下顺利将其播放到结尾（即预测会在播放时暂停以获取更多的缓冲区内容）
ended（）：播放到媒体的结束位置，播放停止
play（）：播放开始
pause（）：播放暂停
上面两个可以通过js控制音乐播放器的暂停与开始
video与audio很相似，大部分属性一样，鉴于我还没怎么用过，就不好意思祸害大家，等我有好的例子再给大家讲。
剩下的留到后面讲，Respect！
HTML浅析——audio标签以及audio标签相关推荐
- 视频标签- video 音频标签- audio
基本使用当前 元素支持三种视频格式: 尽量使用 mp4格式使用语法: <video src="media/mi.mp4"></video> 属性很多,有一 ...
- 【HTML】音视频标签（audio、video、embed）
音视频标签(audio.video.embed) 音频 audio标签 属性 controls autoplay loop 使用方式 提示用户升级浏览器 浏览器不支持MP3格式 兼容低版本浏览器(em ...
- audio标签与video标签的常用属性及方法
一.常用的css属性 1.src:用于指明video标签需要播放的音频的地址 --<audio sec = "音频地址"> < ...
- html5前端Video视频标签和audio音频标签的使用
html5前端Video视频标签和audio音频标签的使用 h5新特性中关于Video视频标签和audio音频标签的使用和浅谈 一.Video视频标签 video标签是h5新特性中用来播放视频的控件, ...
- html audio颜色,HTML audio 标签
HTML 简介 HTML 元素用于在文档中表示音频内容. 元素可以包含多个音频资源, 这些音频资源可以使用 src 属性或者 元素来进行描述: 浏览器将会选择最合适的一个来使用. 因为这个标签是 HT ...
- 关于HTML5的audio标签和video标签删除下载图标
video标签和audio标签在谷歌浏览器上自带下载按钮,当我们不想要下载按钮的时候,可以试一下以下操作 第一种方案: 在video或者audio标签上添加controlsList="nod ...
- HTML——audio标签和video标签
<video>标签专门用来播放网络上的视频或电影,<audio>标签则专门用来播放网络上的音频数据.使用这两个标签,就不再需要使用其他的任何插件了,只要使用支持 HTML5 的 ...
- audio插入背景音乐_HTML5 标签audio添加网页背景音乐代码
html5 是 HTML 5 的新标签,定义声音,好比音乐或其余音频流.html 能够在开始标签和结束标签之间放置文本内容,这样老的浏览器就能够显示出不支持该标签的信息.ide HTML5 Audio ...
- html5 audio 资源,HTML5 Audio(音频)
原标题:HTML5 Audio(音频) HTML5 提供了播放音频文件的标准. 互联网上的音频 直到现在,仍然不存在一项旨在网页上播放音频的标准. 今天,大多数音频是通过插件(比如 Flash)来播放 ...
- HTML标签-排版标签、媒体标签、列表标签、表格标签、表单标签、语义化标签、字符实体
一.排版标签 1.标题标签 在新闻和文章的页面中都离不开标题,用来突出显示文章主题. h系列标题 <body><h1>1级标题</h1> <h2>2级标 ...
最新文章
- 眼球网站经济学之我见——在网站上建立现代的经济体系
- python自学多久可以找到工作-零基础如何自学Python并且找到工作，其实也就这3点，4点...
- 最快让你上手ReactiveCocoa之基础篇
- Sklearn(v3)——SVM理论(1)
- python免安装版_web.py入门01——python安装
- Windows Containers 大冒险: 加速
- Pandas-Series知识点总结
- python调试教程_python进阶教程之==、is和调试
- lua utf8 gbk 编码转换
- 电子计算机的基本概念简述
- java和python结合做项目_由浅入深Java+Python结合项目实战
- 解决Win10更新后兼容性助手提示VMware虚拟机无法在Windows上运行的问题
- 网易创始人之一，周卓林先生
- 自动创建 api 模拟数据
- Android SDK包下载分享
- 基于单片机的电子秤(计价时钟播报)系统设计(#0444)
- 深入理解pdf.js，PDFObject, iframe 三种方式来打开PDF文件的区别
- Office 365：概览——完整的云中Office
- 浅显易懂的说清楚小游戏与H5游戏的区别
- weblogic 由于异常关闭导致文件AdminServer.lok被锁，启动报错