B站链接参数
| key | 说明 |
|---|---|
| aid | 视频ID就是B站的 avxxxx 后面的数字 |
| cid | 应该是客户端id, clientId 的缩写(推测的, 不一定准确)经过测试, 这个字段不填也没关系 |
| page | 第几个视频, 起始下标为 1 (默认值也是为1)就是B站视频, 选集里的, 第几个视频 |
| as_wide | 是否宽屏 1: 宽屏, 0: 小屏 |
| high_quality | 是否高清 1: 高清, 0: 最低视频质量(默认)；如视频有 360p 720p 1080p 三种, 默认或者 high_quality=0 是最低 360p，high_quality=1 是最高1080p |
| danmaku | 是否开启弹幕 1: 开启(默认), 0: 关闭 |
调整清晰度跳转B站
high_quality 参数设置为1,提高清晰度
或者直接通过设置 iframe 的 sandbox 属性去禁止sandbox=“allow-top-navigation allow-same-origin allow-forms allow-scripts
响应式布局(解决窗口太小)
自定义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
}B站分享视频,复制嵌入代码添加到文章。
然后在给iframe 这个标签添加 class="iframe_video" 这个类名
最终代码
<iframe class="iframe_video " src="https://player.bilibili.com/player.html?aid=586201098&bvid=BV1uz4y1S75e&cid=281772825&page=1&high_quality=1" scrolling="no" border="0" frameborder="no" framespacing="0" allowfullscreen="true"> </iframe>