WordPress网站博客文章嵌入B站视频的自适应代码

建站教程
下载量：0【次】
22年12月22日
编辑
最后更新于：2023-10-27 15:14:26

墨梅管理员

释放双眼，带上耳机，听听看~！

本文是《WordPress教程（共15篇）》专题的第 15 篇。阅读本文前，建议先阅读前面的文章：

在编辑博客时，需要嵌入B站视频，但复制B站给的嵌入代码后会发现宽度和高度属性都没有，无法自适应div，单独设置宽度和高度也不太完美，如何解决这个问题？

在这里分享一段代码，只需要替换aid、cid即可解决这个问题：[wm_login]

<iframe id="spkj" src="https://player.bilibili.com/player.html?aid=900831672&bvid=BV1VN4y1K76x&cid=839712989&page=1" rel="external nofollow"  scrolling="no" border="0" frameborder="no" framespacing="0" allowfullscreen="true" width=100% sandbox="allow-top-navigation allow-same-origin allow-forms allow-scripts"> </iframe>
<script type="text/javascript">  
document.getElementById("spkj").style.height=document.getElementById("spkj").scrollWidth*0.76+"px";
</script>

举列：

其中的代码：

sandbox="allow-top-navigation allow-same-origin allow-forms allow-scripts"

可以使点击的弹出链接失效，避免外链跳出本站，如果不需要这个效果，删掉这段代码即可。[/wm_login]

温馨提示

本站网络名称： 墨梅博客

本文章永久网址： https://momeis.net/post-41977.html

网站侵权说明：本网站的文章部分内容可能来源于网络，仅供大家学习与参考，如有侵权，请联系站长Email：momeis6@qq.com 删除处理。
1 本站一切资源不代表本站立场，并不代表本站赞同其观点和对其真实性负责。
2 本站一律禁止以任何方式发布或转载任何违法的相关信息，访客发现请向站长举报
3 本站资源大多存储在云盘，如发现链接失效，请联系我们第一时间更新。