在HTML中使用object和embed标签插入视频
object标签和embed标签都能给页面添加多媒体内容:
一、object
对于object,w3c上定义object为一个嵌入的对象。可以使用此元素向您的 XHTML 页面添加多媒体。此元素允许您规定插入 HTML 文档中的对象的数据和参数,以及可用来显示和操作数据的代码。
<object> 标签用于包含对象,比如图像、音频、视频、Javaapplets、ActiveX、PDF 以及 Flash。object 的初衷是取代 img 和 applet 元素。不过由于漏洞以及缺乏浏览器支持,这一点并未实现。浏览器的对象支持有赖于对象类型。不幸的是,主流浏览器都使用不同的代码来加载相同的对象类型。而幸运的是,object 对象提供了解决方案。如果未显示 object 元素,就会执行位于 <object> 和 </object> 之间的代码。通过这种方式,我们能够嵌套多个 object 元素(每个对应一个浏览器)。
二.object与embed
我们要在网页中正常显示flash内容,那么页面中必须要有指定flash路径的标签。也就是object和embed标签。
object标签是用于windows平台的IE浏览器的,
embed是用于windows和Macintosh平台下的Netscape Navigator浏览器以及Macintosh平台下的IE浏览器。
备注: windows平台的IE利用Activex控件来播放flash而其它的浏览器则使用Netscape插件技术来播放flash。
三、<object>和<embed>标签的区别:
两者都是用来播放多媒体文件的对象,object元素用于IE浏览器,embed元素用于非IE浏览器,为了保证兼容性,通常我们同时使用两个元素,浏览器会自动忽略它不支持的标签。同时使用两个元素时,应该把<embed>标签放在<object>标签的内部。
接下来是代码展示:
<!<-- 直接到腾讯视频分享下面复制html代码过来,里面的.swf就是视频文件了-->
<object id="player" width="684" height="450">
<param name="movie" value="https://imgcache.qq.com/tencentvideo_v1/playerv3/TPout.swf?max_age=86400&v=20161117&vid=g0023l48fzl&auto=0">
<param name="allowFullScreen" value="true">
<param name="allowscriptaccess" value="always">
<param name="wmode" value="Transparent">
<embed src="https://imgcache.qq.com/tencentvideo_v1/playerv3/TPout.swf?max_age=86400&v=20161117&vid=g0023l48fzl&auto=0" allowFullScreen="true" quality="high" width="480" height="400" align="middle" allowScriptAccess="always" type="application/x-shockwave-flash"></embed>
</object>
页面出来效果:IE也可以兼容哦!
非IE移动端 可以只用embed标签引入
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0"><!--移动端必须加这代码-->
<title> </title>
<style>
*{margin:0;padding:0;}
a.weui-media-box {
color: #000;
-webkit-tap-highlight-color: rgba(0,0,0,0);
}
.weui-media-box {
padding: 15px;
position: relative;
}
.content-title-two {
display: block;
width: 100%;
padding: 3.59375vw 3.90625vw;
box-sizing: border-box;
background: #fff;
border-bottom: 1px solid #efefef;
}
.weui-media-box {
float: left;
padding: 10px 15px !important;
width: 100%;
box-sizing: border-box;
}
.content-title-two .content-title-video {
width: 100%;
margin-bottom: 2.03125vw;
}
.content-title-two .content-title-p {
font-size: 2.8125vw;
color: #939393;
}
</style>
</head>
<body>
<!-- 非IE移动端 可以只用embed标签引入-->
<a href="/video/" class="weui-media-box content-title-two">
<h4 class="content-title-h4">[视频] 感动!一声呼喊 十几人合力抬车救出车轮下的男</h4>
<div class="content-title-video">
<embed style="width: 300px" src="https://v.qq.com/iframe/player.html?vid=l0511aua3fd&tiny=0&auto=0">
</div>
<p class="content-title-p">2017-06-07 00:00:00</p>
</a>
</body>
</html>
在HTML中使用object和embed标签插入视频的更多相关文章
- html中object和embed标签的区别
♦object定义一个嵌入的对象.请使用此元素向您的 XHTML 页面添加多媒体.此元素允许您规定插入 HTML 文档中的对象的数据和参数,以及可用来显示和操作数据的代码. ♦<object&g ...
- OBJECT和EMBED标签(转载)
一.介绍: 我们要在网页中正常显示flash内容,那么页面中必须要有指定flash路径的标 签.也就是OBJECT和EMBED标签.OBJECT标签是用于windows平台的IE浏览器的,而EMBED ...
- 转: object 和embed 标签播放flash
一.介绍: 我们要在网页中正常显示flash内容,那么页面中必须要有指定flash路径的标 签.也就是OBJECT和 EMBED标签.OBJECT标签是用于windows平台的IE浏览器的,而EMBE ...
- OBJECT和EMBED标签
一.介绍: 我们要在网页中正常显示flash内容,那么页面中必须要有指定flash路径的标 签.也就是OBJECT和EMBED标签.OBJECT标签是用于windows平台的IE浏览器的,而EMBED ...
- 用HTML5 video标签插入视频,在谷歌浏览器上播放视频时,右下角显示的下载按钮怎么去掉
使用H5的video标签可以直接插入视频,一般在浏览器效果如下图显示: 但有时在谷歌浏览器上显示,会遇到右下角有下载按钮.如果项目要求去掉这个下载按钮,怎么办呢?如下图显示: 分析: 经本人测试,是谷 ...
- 网页中多媒体对像标记<OBJECT>和<EMBED>
在网页中常用object和embed标记插入的多媒体对象,比如FLASH,视频等. 用一个快播例子说明下这两个标记的使用和区别: <object classid="clsid:F3D0 ...
- 【转】object标签和embed标签
我们现在大部分人做网页,都是直接用DW插入flash,而且DW也是所见即所得,直接生成了相应的flash显示代码.可是我们又有多少人了解这些直接由DW生成的代码呢?其实我接触flash player标 ...
- object标签和embed标签
概述 html中有许多用于嵌入各种类型内容的标签,包括:embed,audio,canvas,iframe,img,math,object,svg和video.之前我在很多地方都看到了object标签 ...
- 关于object和embed
最近发现很久之前写的demo 在FF上有兼容问题, 主要发生在如下: 由于时间太久,自己都有点搞不清怎么写的,尤其是object标签,今天查了很多资料,总结一下object标签 在网页中正常显示fla ...
随机推荐
- 深入出不来nodejs源码-V8引擎初探
原本打算是把node源码看得差不多了再去深入V8的,但是这两者基本上没办法分开讲. 与express是基于node的封装不同,node是基于V8的一个应用,源码内容已经渗透到V8层面,因此这章简述一下 ...
- WPF备忘录(4)打个勾画个叉娱乐下
<Path Grid.Column="2" Data="M43,5 L20,40 20,40 0,20 6,15 18,26 37,7 43,5 z" F ...
- Redis集合操作
Redis的集合以无序的形式存储多个各不相同的元素 (常用的集合命令) SADD : SADD key-name item [item ...]----------将一个或多个元素添加到集合里,并返回 ...
- C# Thread.Abort方法真的让线程停止了吗?
大家都知道在C#里面,我们可以使用 Thread.Start方法来启动一个线程,当我们想停止执行的线程时可以使用Thread.Abort方法来强制停止正在执行的线程,但是请注意,你确定调用了Threa ...
- 记录怎样把安全证书导入到java中的cacerts证书库
这次项目上需要去证书中解析公钥所以这里分享下方法: 首先准备一个证书文件比如叫:test.crt(一般是cer结尾) 下一步准备把证书导入到导入java中的cacerts证书库里 方法如下: 比如本地 ...
- Expression<Func<T>>和Func<T>
以前用EF的时候,由于where的时候有Expression<Func<T>>和Func<T>两种查询条件,误用了Func<T>那个重载,后来还想通过f ...
- 了解java虚拟机—串行回收器(6)
串行回收器 串行回收器只有一个工作线程,串行回收器可以在新生代和老年代使用,根据作用于不同的堆和空间,分为新生代串行回收器和老年代串行回收器. 1.新生代串行回收器 串行收集器是所有垃圾回收器中最古老 ...
- Selenium使用总结(Java版本)
硒在最近的发展中被广泛应用,因为它以前没有被使用过,并且已经走了太多的坑.这是一张唱片. 1.环境配置 配置要点: 1.Web驱动程序应该与浏览器版本相对应,chrome使用chrome驱动程序和ch ...
- Points on Cycle (hdu1700,几何)
Points on Cycle Time Limit: 1000/1000 MS (Java/Others) Memory Limit: 32768/32768 K (Java/Others) ...
- 存储过程TYPE类型参数调试
当我们写完一段存储过程后,必然需要调试运行一下写的代码是否能成功运行,当参数是字符,数字或日期时,可以直接在测试窗口输入值.但是类型如果是定义好的TYPE,就无法简单的输入. 一.自定义TYPE TY ...