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 相关文章推荐
纯DOM+CSS3实现简单的小风车动画
Sep 27 HTML / CSS
CSS3模块的目前的状况分析
Feb 24 HTML / CSS
HTML+CSS3 模仿Windows7 桌面效果
Jun 17 HTML / CSS
利用CSS3参考手册和CSS3代码生成工具加速来学习网页制
Jul 11 HTML / CSS
CSS3 Calc实现滚动条出现页面不跳动问题
Sep 14 HTML / CSS
详解background属性的8个属性值(面试题)
Nov 02 HTML / CSS
HTML5标签小集
Aug 02 HTML / CSS
html5 桌面提醒:Notifycations应用介绍
Nov 27 HTML / CSS
canvas实现圆形进度条动画的示例代码
Dec 26 HTML / CSS
HTML5 input新增type属性color颜色拾取器的实例代码
Aug 27 HTML / CSS
详解使用双缓存解决Canvas clearRect引起的闪屏问题
Apr 29 HTML / CSS
AmazeUI的下载配置与Helloworld的实现
Aug 19 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
学习使用PHP数组
2006/10/09 PHP
php中实现记住密码自动登录的代码
2011/03/02 PHP
PHP中对用户身份认证实现两种方法
2011/06/04 PHP
php实现的双向队列类实例
2014/09/24 PHP
PHP的Yii框架入门使用教程
2016/02/15 PHP
php删除一个路径下的所有文件夹和文件的方法
2018/02/07 PHP
PHP7 foreach() 函数修改
2021/03/09 PHP
浅谈JavaScript中运算符的优先级
2015/07/07 Javascript
原生JS实现匀速图片轮播动画
2016/10/18 Javascript
jQuery实现动态给table赋值的方法示例
2017/07/04 jQuery
基于Vue单文件组件详解
2017/09/15 Javascript
vue-cli webpack2项目打包优化分享
2018/02/07 Javascript
Nodejs下使用gm圆形裁剪并合成图片的示例
2018/02/22 NodeJs
angular4 共享服务在多个组件中数据通信的示例
2018/03/30 Javascript
JavaScript插入排序算法原理与实现方法示例
2018/08/06 Javascript
了解javascript中的Dom操作
2019/05/27 Javascript
关于JS解构的5种有趣用法
2019/09/05 Javascript
vue 路由守卫(导航守卫)及其具体使用
2020/02/25 Javascript
python为tornado添加recaptcha验证码功能
2014/02/26 Python
Python单例模式实例详解
2017/03/01 Python
程序员写Python时的5个坏习惯,你有几条?
2018/11/26 Python
Jupyter notebook设置背景主题,字体大小及自动补全代码的操作
2020/04/13 Python
Mac PyCharm中的.gitignore 安装设置教程
2020/04/16 Python
如何利用python web框架做文件流下载的实现示例
2020/06/02 Python
H&M美国官网:欧洲最大的服饰零售商
2016/09/07 全球购物
开业主持词
2014/03/21 职场文书
公职人员索取回扣检举信
2014/04/04 职场文书
预备党员公开承诺书
2014/05/28 职场文书
学习实践科学发展观心得体会
2014/09/10 职场文书
反对四风自我剖析材料
2014/10/07 职场文书
学习走群众路线心得体会
2014/11/05 职场文书
离婚协议书格式
2015/01/26 职场文书
2015年大学生实习评语
2015/03/25 职场文书
安全生产感想
2015/08/07 职场文书
2016年小学“我们的节日·中秋节”活动总结
2016/04/05 职场文书
总结python多进程multiprocessing的相关知识
2021/06/29 Python