在HTML中使用object和embed标签插入视频

object标签和embed标签都能给页面添加多媒体内容:

一、object

对于object，w3c上定义object为一个嵌入的对象。可以使用此元素向您的 XHTML 页面添加多媒体。此元素允许您规定插入 HTML 文档中的对象的数据和参数，以及可用来显示和操作数据的代码。

二.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标签插入视频

一、object

二.object与embed

三、<object>和<embed>标签的区别：

最新文章

热门文章