HTML5 source标签:媒介元素定义媒介资源


Posted in HTML / CSS onJanuary 29, 2018

HTML5 source标签是一种媒介元素(比如 <video> 和 <audio>)来定义媒介资源。<source> 标签允许您规定可替换的视频/音频文件供浏览器根据它对媒体类型或者编解码器的支持进行选择。 这里主机吧给大家讲一下source标签的应用属性和实例。

<source>标签属性:

属性 描述
media media query 规定媒体资源的类型。
src url 规定媒体文件的 URL。
type numeric value 规定媒体资源的 MIME 类型。  

<source> 标签支持HTML中的全局属性和事件属性。

应用实例:

拥有两份源文件的音频播放器。浏览器应该选择它所支持的文件(如果有的话):

<audio controls>
   <source src="horse.ogg" type="audio/ogg">
   <source src="horse.mp3" type="audio/mpeg">
 Your browser does not support the audio element.
</audio>

输出:

HTML5 source标签:媒介元素定义媒介资源

HTML 4.01 与 HTML 5 之间的差异

<source> 标签是 HTML 5 中的新标签。

总结

以上所述是小编给大家介绍的HTML5 source标签:媒介元素定义媒介资源,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

HTML / CSS 相关文章推荐
CSS3字体效果的设置方法小结
Jun 13 HTML / CSS
通过css3动画和opacity透明度实现呼吸灯效果
Aug 09 HTML / CSS
带有css3动画效果的兼容多浏览器简单导航条示例
Jan 26 HTML / CSS
CSS3 text-shadow实现文字阴影效果
Feb 24 HTML / CSS
CSS3利用text-shadow属性实现多种效果的文字样式展现方法
Aug 25 HTML / CSS
css3 盒模型以及box-sizing属性全面了解
Sep 20 HTML / CSS
详解HTML5通讯录获取指定多个人的信息
Dec 20 HTML / CSS
利用html5 canvas破解简单验证码及getImageData接口应用
Jan 25 HTML / CSS
基于HTML5+CSS3实现简单的时钟效果
Sep 11 HTML / CSS
Html5 滚动穿透的方法
May 13 HTML / CSS
data:image data url 文件转为Blob上传后端的方法
Jul 16 HTML / CSS
html2canvas截图空白问题的解决
Mar 24 HTML / CSS
HTML5仿微信聊天界面、微信朋友圈实例代码
Jan 29 #HTML / CSS
详解HTML5 data-* 自定义属性
Jan 24 #HTML / CSS
详解html5 shiv.js和respond.min.js
Jan 24 #HTML / CSS
浅析HTML5:'data-'属性的作用
Jan 23 #HTML / CSS
HTML5 常见面试题之PC端和移动端区别介绍
Jan 22 #HTML / CSS
浅谈html5 video 移动端填坑记
Jan 15 #HTML / CSS
html5 Canvas实现图片旋转的示例
Jan 15 #HTML / CSS
You might like
实用函数4
2007/11/08 PHP
PHP学习 运算符与运算符优先级
2008/06/15 PHP
深入探讨PHP中的内存管理问题
2011/08/31 PHP
学习使用curl采集curl使用方法
2012/01/11 PHP
php生成静态页面并实现预览功能
2019/06/27 PHP
web页面数据展示新想法(json)
2010/06/08 Javascript
jquery+javascript编写国籍控件
2015/02/12 Javascript
javascript实现dom动态创建省市纵向列表菜单的方法
2015/05/14 Javascript
Highcharts使用简例及异步动态读取数据
2015/12/30 Javascript
jQuery unbind()方法实例详解
2016/01/19 Javascript
Angular中使用ui router实现系统权限控制及开发遇到问题
2016/09/23 Javascript
JS中跨页面调用变量和函数的方法(例如a.js 和 b.js中互相调用)
2016/11/01 Javascript
深入理解React高阶组件
2017/09/28 Javascript
微信小程序getPhoneNumber获取用户手机号
2017/09/29 Javascript
node静态服务器实现静态读取文件或文件夹
2019/12/03 Javascript
Python的装饰器模式与面向切面编程详解
2015/06/21 Python
python实现实时监控文件的方法
2016/08/26 Python
python实现读取大文件并逐行写入另外一个文件
2018/04/19 Python
对python append 与浅拷贝的实例讲解
2018/05/04 Python
使用anaconda的pip安装第三方python包的操作步骤
2018/06/11 Python
Python3爬虫爬取英雄联盟高清桌面壁纸功能示例【基于Scrapy框架】
2018/12/05 Python
Python模拟登录和登录跳转的参考示例
2020/10/30 Python
香港演唱会订票网站:StubHub香港
2019/10/10 全球购物
华为python面试题
2016/05/03 面试题
客户代表自我评价范例
2013/09/24 职场文书
环境科学专业个人求职信
2013/09/26 职场文书
会计实习期自我鉴定
2013/10/06 职场文书
一个大学生十年的职业规划
2014/01/17 职场文书
人事主管岗位职责
2014/01/30 职场文书
《巨人的花园》教学反思
2014/02/12 职场文书
就业协议书样本
2014/08/20 职场文书
教师工作决心书
2015/02/04 职场文书
古诗之爱国古诗5首
2019/09/20 职场文书
MySql子查询IN的执行和优化的实现
2021/08/02 MySQL
MYSQL中文乱码问题的解决方案
2022/06/14 MySQL
浅谈为什么我的 z-index 又不生效了
2022/07/15 HTML / CSS