很多人在做网站或者网页的时候,在网页中嵌入土豆、优酷、爱奇艺的视频播放器很简单,但是将腾讯视频嵌入网页后却不能正常显示,包括小贱也遇到这样问题,这是怎么回事?那么怎么将腾讯视频嵌入网页并能够正常的播放呢?下面小贱来给大家分享一下腾讯视频怎么插入嵌入网页的教程方法。

首先我们以这一段视频为例:视频地址 https://v.qq.com/x/cover/ekjprcr9uf11iat.html

这是一段腾讯视频《未来地球》的视频,我们要在网页嵌入这段视频一般都是用视频下面的分享代码,比如这段视频的通用分享代码是这样的

<iframe frameborder="0" src="https://v.qq.com/txp/iframe/player.html?vid=m00201pvix1" allowFullScreen="true"></iframe>

那么如果我们直接用这段代码插入网页,视频显示会不正常,如下图

这是PC网页的显示效果 视频界面很小

分享一下腾讯视频怎么插入嵌入网页并正常显示无错位的教程方法

这是移动网页的显示效果 有明显的错位 视频已经超出屏幕的范围

分享一下腾讯视频怎么插入嵌入网页并正常显示无错位的教程方法

我们该如何让视频适应屏幕呢,别着急,下面小贱就分享给大家一段代码,让腾讯视频嵌入网页并能够正常的播放。

下面这段代码就是腾讯视频嵌入网页的代码。我们只需替换这段代码带xxx的这部分就可以了。

<p style="text-align: center;">
    <iframe class="video_iframe" style="z-index:1;" src="http://v.qq.com/iframe/player.html?vid=xxx" allowfullscreen="" frameborder="0" height="375" width="100%"></iframe>
</p>

还记得上面提到的通用分享代码吗?找到这段代码里面vid=后面这一串字符,也就是vid=g00193w923e,我们把g00193w923e替换掉上面这段代码的xxx这部分就可以了。

替换以后的代码是这样的

<p style="text-align: center;">
    <iframe class="video_iframe" style="z-index:1;" src="http://v.qq.com/iframe/player.html?vid=g00193w923e" allowfullscreen="" frameborder="0" height="375" width="100%"></iframe>
</p>

好了,把这段代码插入网页腾讯视频能够正常显示并播放了。

下面是最终效果



推荐阅读:

安卓极品阅读V1.0.4破解VIP会员版

喝醉的人啥事都敢做

妹子你是不是突然想吃海鲜了

远水救不了近火

臭不要脸的 滚