第13课:HTML音频/视频

HTML 视频

<embed> 标签 下面的 HTML 代码显示嵌入网页的 Flash 视频:

<embed src=swf/"movie.swf" height="200" width="200"/>

<object> 标签 <object> 标签的作用是在 HTML 页面中嵌入多媒体元素。
下面的 HTML 代码显示嵌入网页的 Flash 视频:

<object data=swf/"movie.swf" height="200" width="200"/>

使用 HTML5 <video> 标签 <video> 是 HTML 5 中的新标签。
<video> 标签的作用是在 HTML 页面中嵌入视频元素。
以下 HTML 片段会显示一段嵌入网页的 ogg、mp4 或 webm 格式的视频:

<video width="320" height="240" controls="controls">
<source src=other/"movie.mp4" type="video/mp4" />
<source src=other/"movie.ogg" type="video/ogg" />
<source src=other/"movie.webm" type="video/webm" />
Your browser does not support the video tag.
</video>

问题: 1)您必须把视频转换为很多不同的格式。2)<video> 元素在老式浏览器中无效。3)<video> 元素无法通过 HTML 4 和 XHTML 验证。最好的 HTML 解决方法 HTML 5 + <object> + <embed>

<video width="320" height="240" controls="controls">
<source src=other/"movie.mp4" type="video/mp4" />
<source src=other/"movie.ogg" type="video/ogg" />
<source src=other/"movie.webm" type="video/webm" />
<object data=other/"movie.mp4" width="320" height="240">
<embed src=swf/"movie.swf" width="320" height="240" />
</object>
</video>

上例中使用了 4 中不同的视频格式。HTML 5 <video> 元素会尝试播放以 mp4、ogg 或 webm 格式中的一种来播放视频。如果均失败,则回退到 <embed> 元素。优酷解决方案在 HTML 中显示视频的最简单的方法是使用优酷等视频网站。
如果您希望在网页中播放视频,那么您可以把视频上传到优酷等视频网站,然后在您的网页中插入优酷等视频网站提供的分享代码,如 HTML 代码即可播放视频:

<embed src=swf/v.swf" width="480" height="400" type="application/x-shockwave-flash">
</embed>

125jz网原创文章。发布者:江山如画,转载请注明出处:http://www.125jz.com/455.html

(0)
江山如画的头像江山如画管理团队
上一篇 2018年1月18日 下午7:55
下一篇 2018年1月19日 下午7:34

99%的人还看了以下文章

  • 网页制作常用正则表达式大全、正则表达式在线测试工具

    正则表达式,用一段非常简短的表达式语句,便能够快速实现一个非常复杂的业务逻辑。正则表达式经常被用于字段或任意字符串的校验。熟练地掌握正则表达式的话,能够使你的开发效率得到极大的提升。 正则表达式在线测试工具 regex101是一个非常不错的正则表达式在线测试工具,你可以直接在线测试你的正则表达式。 网页制作常用正则表达式 1 用户名正则 //用户名正则,4到…

    2018年9月12日
    4.1K0
  • CSS制作简洁的栏目/标题样式

    CSS制作简洁的栏目/标题样式 HTML: <h2><strong>栏目名称</strong></h2> <h2><strong class=”blue”>网页设计</strong></h2> <h2><strong>网站制作</st…

    2019年1月5日
    8.0K0
  • 第2课:CSS的工作原理

    在这一课,你将学习如何制作自己的第一个样式表。你将了解基本的CSS模型,以及在HTML文档里使用CSS所必需的代码。

    2020年2月22日
    3.3K0
  • 纯CSS制作热门文章排行,且前3名背景不同

    要制作文章排行前10、或评论排行榜1、2、3、4…,还要给前三名加上不同的背景,可以用纯css实现(用Ol,li),但通常网页制作中使用ul的比较多,因为不同浏览器对ol li有序列表默认自带的序号列表有着不同显示,容易引起浏览器兼容问题,所以遇到这样的有序排版布局,最简单是将序号切成背景图片! 使用ul li实现文章排行有序排版布局。   htm…

    2018年7月14日
    3.3K0
  • 如何制作图片按钮,并为图片按钮添加提交表单和重置表单功能

    网页中有表单,表单的默认按钮样式不是很好看,很多人为了美观使用图片做按钮。 今天中国网页设计给大家分享在网页制作中怎么制作图片按钮,并为图片按钮添加提交表单和重置表单功能。 一、图片按钮的制作方法 1、<input type=”image” /> 定义图像形式的提交按钮。 <input type=”image” sr…

    2018年9月30日
    5.1K0
  • CSS制作三角形原理—超简单

    网页制作中我们经常会需要三角形图标,例如内容展开收起、左右箭头点击切换轮播,点击某条列表数据查看详情等。 三角形图标应用范围广,我们有必要了解一下它的实现原理。 1) 一个最基础的边框效果 .content { width: 50px; height: 50px; border: 2px solid; border-color:#ff9600 #3366ff…

    2019年11月26日 网页制作
    3.1K0

发表回复

登录后才能评论