HTML 嵌入多媒体

时间:2019-06-08 23:19:24  来源:igfitidea点击:

将视频或声音添加到网站的最简单方法是包含名为<embed>的特殊HTML标记。
此标记使浏览器本身包含多媒体控件,这些控件自动提供浏览器支持<embed>标记和给定的媒体类型。

不能识别<embed>标签的浏览器,还可以使用 <noembed>标签。例如,我们可以使用<embed>显示我们选择的电影,如果浏览器不支持<embed>标记,则可以使用<noembed>显示单个JPG图像。

HTML嵌入多媒体示例

<body>
   <embed src = "./static/music.wmv" width = "100%" height = "60" >
      <noembed><img src = "yourimage.gif" alt = "不支持wmv多媒体" ></noembed>
   </embed>
</body>

<embed>标签属性

以下是可与<embed>标记一起使用的重要属性列表。

注意−HTML5中不推荐使用align和autostart属性。不要使用这些属性。

属性说明
align确定如何对齐对象。它可以设置为中间、左侧或右侧。
autostart指示媒体是否应自动启动。你可以设置为true或者false。
loop指定声音是应连续播放(将“循环”设置为true)、特定次数(正值) 还是根本不播放(false)
playcount指定播放声音的次数。如果你正在使用IE,这是循环的替代选项。
hidden指定是否应在页面上显示多媒体对象。false表示否,true表示是。
width控件的宽度(以像素为单位)
height控件的高度(以像素为单位)
name用于引用对象的名称。
src要嵌入的对象的URL。
volume控制音量。可以从0(关闭)到100(全音量)。

支持的视频类型

我们可以在嵌入标记内使用各种媒体类型,如Flash movies(.swf)、AVI(.AVI)和MOV的(.MOV)文件类型。

  1. .swf文件-是Macromedia的Flash程序创建的文件类型。

  2. .wmv文件-是Microsoft Windows的媒体视频文件类型。

  3. .mov文件- 苹果的快速电影格式。

  4. .mpeg文件-是由电影专家组创建的电影文件。

<body>
   <embed src = "/多媒体文件名.swf" width = "200" height = "200" >
      <noembed><img src = "图片.png" alt = "不支持多媒体控件" ></noembed>
   </embed>
</body>

背景音频

我们可以使用HTML<bgsound>标记在网页背景中播放配乐。只有Internet Explorer支持此标记,其他大多数浏览器都忽略此标记。当用户首次下载并显示网页时,它会下载并播放音频文件。当用户刷新浏览器时,背景声音文件也将重放。

注意−bgsound标记已弃用,它应该在未来的HTML版本中删除。所以不应该使用它们,建议使用HTML5音频标签audio来添加声音。

这个标记只有两个属性loop和src。这两个属性的含义与上面解释的相同。

播放一个小midi文件:

<body>
   <bgsound src = "/html/yourfile.mid">
      <noembed><img src = "yourimage.gif" ></noembed>
   </bgsound>
</body>

此标记不显示任何组件,并保持隐藏状态。

Internet Explorer也只能处理三种不同的声音格式文件—wav,au,midi。

HTML对象标记

HTML4引入了<object>元素,它提供了通用对象包含的通用解决方案。
<object>元素允许HTML作者指定用户代理表示对象所需的所有内容。

HTML对象标记示例

将HTML文档嵌入到HTML文档中:

<object data = "src/test.html" type = "text/html" width = "300" height = "200">
   <a href = "src/test.html">test.htm</a>
</object>

若浏览器不支持对象标记,链接将出现在图片中。

HTML对象标记示例2

在HTML文档中嵌入PDF文档:

<object data = "src/test.pdf" type = "application/pdf" width = "300" height = "200">
   <a href = "src/test.pdf">test.html</a>
</object>

HTML对象标记示例3

我们可以使用<param>标记指定与文档相关的一些参数。

<object data = "data/test.wav" type = "audio/x-wav" width = "200" height = "20">
   <param name = "src" value = "data/test.wav">
   <param name = "autoplay" value = "false">
   <param name = "autoStart" value = "0">
   <a href = "src/test.wav">test.wav</a>
</object>

HTML对象标记示例4

我们可以按如下方式添加flash文档:

<object classid = "clsid:A27EAB1E-CE1A-11Ef-91B8-222553520000" id = "panda" 
   codebase = "someplace/swflash.cab" width = "200" height = "300">
   
   <param name = "movie" value = "flash/panda.swf" />
   <param name = "quality" value = "high" />
   <img src = "panda.jpg" width = "200" height = "300" alt = "panda" />
</object>

HTML对象标记示例5

我们可以将java小程序添加到HTML文档中,如下所示–

<object classid = "clsid:6ad4c642-244e-77d7-b3e4-22625f444d43" 
   width = "200" height = "200">
   <param name = "code" value = "applet.class">
</object>

classid属性标识要使用哪个版本的Java插件。