给typecho文章内挂载B站视频

以下是我B站刚上传的王者荣耀31杀视频

如下所示
有弹幕但并不是蓝光

自定义css

/*视频挂载*/
.iframe_video {
    position: relative;
    width: 100%;
}
@media only screen and (max-width: 767px) {
    .iframe_video {
        height: 15em;
    }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
    .iframe_video {
        height: 20em;
    }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
    .iframe_video {
        height: 30em;
    }
}
@media only screen and (min-width: 1200px) {
    .iframe_video {
        height: 40em;
    }
}
.iframe_cross {
    position: relative;
    width: 100%;
    height: 0;
    padding-bottom: 75%
}
.iframe_cross iframe {
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0
}

如果视频大小不一样,自己改上面的CSS即可

接着打开B站网页版找到你要挂载的B站视频
如下图所示

复制_代码_在代码_<iframe_后面插入_class=”iframe_video”_这行代码
如下

<iframe class="iframe_video" src="//player.bilibili.com/player.html?aid=79227454&cid=135582671&page=1" scrolling="no" border="0" frameborder="no" framespacing="0" allowfullscreen="true"> </iframe>

插入后,把代码放在你文章需要放置的地方,如所示文章顶部视频

© 版权声明
THE END
喜欢就支持以下吧
点赞1
分享
评论 抢沙发

请登录后发表评论