外链引用哔哩哔哩视频自适应

B站分享使用的的iframe,插入到网页会显得很小,我们给他外部添加一个.bilibili的div

<div class="bilibili">
<iframe src="//player.bilibili.com/player.html?aid=60859044&cid=105906898&page=1" scrolling="auto" border="0" frameborder="1" framespacing="1" allowfullscreen="true"> </iframe>
</div>

然后添加CSS样式

/*bilibili*/
.bilibili {
  position: relative;
  width: 100%;
  height: 0;
  padding-bottom: 75%;
}

.bilibili iframe {
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
}

这样就可以实现自适应

小趣

我还没有学会写个人说明!

相关推荐

发表评论

电子邮件地址不会被公开。 必填项已用*标注

  • 友情链接:
  • 1梦博客
  • DYBOY
  • Norsl
  • TRY博客
  • 免费论文查重
  • 星宇博客
  • 暗盾安全
  • 站长导航网
  • 青衫慧博客
  • 微信扫一扫

    微信扫一扫

    微信扫一扫,分享到朋友圈

    外链引用哔哩哔哩视频自适应
    返回顶部

    显示

    忘记密码?

    显示

    显示

    获取验证码

    Close