HTML5的结构和语义(5):内嵌媒体


Posted in HTML / CSS onOctober 17, 2008

视频已经在 Web 上广泛流行了,但是其格式几乎都是专有的。YouTube 使用 Flash,Microsoft 使用 Windows Media®,Apple 使用 QuickTime。在一种浏览器中用来嵌入这些内容的标记在另一种浏览器中是无效的。因此,WhatWG 提议引入一个新的 video 元素,用来嵌入任意视频格式。例如,可以用以下代码嵌入我的 QuickTime 电影 “a Sora in Prospect Park”:
<video src="http://www.cafeaulait.org/birds/sora.mov" />

对于以哪种格式和解码器作为首选,仍然有争议。可能会强力推荐或要求使用 Ogg Theora。还可以可选地支持 QuickTime 等专有格式和 MPEG-4 等受专利限制的格式。实际使用的格式很可能由市场决定,就像是 GIF、JPEG 和 PNG 格式那样(这些格式通过市场竞争压倒了 BMP、X-Bitmap 和 JPEG 2000 等竞争者,成为 img 元素的首选格式)。

还提议引入 audio 元素。例如,可以使用以下代码给 Web 页面加上背景音乐:
<audio src="spacemusic.mp3" autoplay="autoplay" loop="20000" />

autoplay 属性指示浏览器在装载页面后立即开始播放,而不等待明确的用户请求。音频循环播放 20,000 次,然后停止(或者在用户关闭窗口或转到另一个页面时停止)。当然,浏览器可以(而且应该)允许用户关闭内嵌的媒体,不应该只按页面作者的要求去做。

浏览器必须支持 WAV 格式,还可以支持 MP3 等其他格式。

因为老式浏览器不支持这些元素,而且它们对于盲人和聋人用户来说没有意义,所以 audio 和 video 元素可以包含额外的标记,用来描述音频和视频的内容。这对搜索引擎也有帮助。在理想情况下,这些标记是音频和视频内容的完整文字版本。例如,代码8 显示 用 HTML 5 编写的 John F. Kennedy 的就职演说。
<audio src="kennedyinauguraladdrees.mp3">
<p>
Vice President Johnson, Mr. Speaker, Mr. Chief Justice,
President Eisenhower, Vice President Nixon, President Truman,
Reverend Clergy, fellow citizens:
</p>
<p>
We observe today not a victory of party, but a celebration of
freedom -- symbolizing an end, as well as a beginning --
signifying renewal, as well as change. For I have sworn before
you and Almighty God the same solemn oath our forebears
prescribed nearly a century and three-quarters ago.
</p>
<p>
The world is very different now. For man holds in his mortal
hands the power to abolish all forms of human poverty and all
forms of human life. And yet the same revolutionary beliefs for
which our forebears fought are still at issue around the globe --
the belief that the rights of man come not from the
generosity of the state, but from the hand of God.
</p>
<p>
...
</p>
</audio>

(待续)

HTML / CSS 相关文章推荐
详解CSS样式中的 !important * _ 符号
Mar 09 HTML / CSS
CSS改变网页中鼠标选中文字背景颜色例子
Apr 23 HTML / CSS
CSS3移动端vw+rem不依赖JS实现响应式布局的方法
Jan 23 HTML / CSS
HTML5的结构和语义(2):结构
Oct 17 HTML / CSS
一张图片能隐含千言万语之隐藏你的程序代码
Dec 13 HTML / CSS
html5 css3网站菜单实现代码
Dec 23 HTML / CSS
html5实现移动端适配完美写法
Nov 16 HTML / CSS
快速实现一个简单的canvas迷宫游戏的示例
Jul 04 HTML / CSS
htnl5利用svg页面高斯模糊的方法
Jul 20 HTML / CSS
Canvas如何做个雪花屏版404的实现
Sep 25 HTML / CSS
如何利用 CSS Overview 面板重构优化你的网站
Oct 24 HTML / CSS
css3应用示例:新增的选择器
Mar 16 HTML / CSS
HTML5的结构和语义(5):交互
Oct 17 #HTML / CSS
HTML5 语义化结构化规范化
Oct 17 #HTML / CSS
HTML5 与 XHTML2
Oct 17 #HTML / CSS
X/HTML5 和 XHTML2
Oct 17 #HTML / CSS
HTML5: Web 标准最巨大的飞跃
Oct 17 #HTML / CSS
详解Html5中video标签那些属性和方法
Jul 01 #HTML / CSS
HTML5之多线程(Web Worker)
Jan 02 #HTML / CSS
You might like
使用dump函数,给php加断点测试
2013/06/25 PHP
php中time()与$_SERVER[REQUEST_TIME]用法区别
2014/11/19 PHP
PHP简单选择排序算法实例
2015/01/26 PHP
PHP中使用mpdf 导出PDF文件的实现方法
2018/10/22 PHP
Laravel框架查询构造器 CURD操作示例
2019/09/04 PHP
一个对于js this关键字的问题
2007/01/09 Javascript
纯js实现的论坛常用的运行代码的效果
2008/07/15 Javascript
Javascript中的变量使用说明
2010/05/18 Javascript
js中方法重载如何实现?以及函数的参数问题
2013/08/01 Javascript
js 单击式的下拉菜单效果实例
2013/08/13 Javascript
CheckBoxList多选样式jquery、C#获取选择项
2013/09/06 Javascript
Javascript操作URL函数修改版
2013/11/07 Javascript
JavaScript中this详解
2015/09/01 Javascript
jQuery之简单的表单验证实例
2016/07/07 Javascript
AngularJS使用自定义指令替代ng-repeat的方法
2016/09/17 Javascript
js实现自定义路由
2017/02/04 Javascript
Vue微信项目按需授权登录策略实践思路详解
2018/05/07 Javascript
react脚手架如何配置less和ant按需加载的方法步骤
2018/11/28 Javascript
详解微信小程序胶囊按钮返回|首页自定义导航栏功能
2019/06/14 Javascript
vue webpack build资源相对路径的问题及解决方法
2020/06/04 Javascript
pyramid配置session的方法教程
2013/11/27 Python
python使用paramiko模块实现ssh远程登陆上传文件并执行
2014/01/27 Python
python实现数通设备tftp备份配置文件示例
2014/04/02 Python
分析在Python中何种情况下需要使用断言
2015/04/01 Python
Django实现文件上传下载功能
2019/10/06 Python
Pytorch使用MNIST数据集实现CGAN和生成指定的数字方式
2020/01/10 Python
详解pandas.DataFrame.plot() 画图函数
2020/06/14 Python
Python类的继承super相关原理解析
2020/10/22 Python
Python日志打印里logging.getLogger源码分析详解
2021/01/17 Python
耐克中国官方商城:Nike中国
2018/10/18 全球购物
三星印度官网:Samsung印度
2019/08/03 全球购物
学生夜不归宿检讨书
2014/09/23 职场文书
营销与策划实训报告
2014/11/05 职场文书
2014年小学英语教师工作总
2014/12/03 职场文书
2014年初三班主任工作总结
2014/12/05 职场文书
Windows和Linux上部署Golang并运行程序
2022/04/22 Servers