如何在WordPress插入Bilibili视频

现在很多小伙伴都喜欢去B站，给自己喜欢的UP主一键三联。但B站自带的分享嵌入，插入到WordPress中，很丑很丑。

因此，找了各种资料，发现加点代码即可实现自适应，且美观大气。

B站自带的分享操作如下图：

# 默认分享嵌入代码：
<iframe src="//player.bilibili.com/player.html?aid=630411817&bvid=BV1G84y1c76n&cid=335718222&page=1" scrolling="no" border="0" frameborder="no" framespacing="0" allowfullscreen="true"> </iframe>

# 优化后嵌入代码（加入样式）：
<div style="position: relative; padding: 40% 45%;"><iframe src="//player.bilibili.com/player.html?aid=630411817&bvid=BV1G84y1c76n&cid=335718222&page=1&as_wide=1&high_quality=1&danmaku=1" scrolling="no" border="0" frameborder="no" framespacing="0" allowfullscreen="true" style="position: absolute; width: 100%; height: 100%; left: 0; top: 0;"></iframe></div>

嫌每次手动修改忒不方便，便发挥半桶水的码农精神，基于.NET CORE做了个小工具，不确定各位能否在本机使用。

Bilibili地址转换小工具​blog.redq.cn/wp-content/uploads/2021/07/Bilibili%E5%9C%B0%E5%9D%80%E8%BD%AC%E6%8D%A2%E5%B0%8F%E5%B7%A5%E5%85%B7.zip

IFRAME是HTML标签，作用是文档中的文档，或者浮动的框架(FRAME)。iframe元素会创建包含另外一个文档的内联框架（即行内框架）

div元素在网页中是最常用的元素，可以把div元素看成一个矩形区域的容器，在这个容器内可以存放其它HTML元素，也包括div元素，因此div元素是可以嵌套的。借助于CSS样式，能够把div元素放置在网页的任何位置，实现网页的精致排版。为了更好理解div的功能和使用方法，文中使用了一些CSS样式，对这些样式的作用本文不作详解，在后面CSS的课程中，会详细解释CSS样式的作用。
优化后代码可以控制视频框架大小和背景大小

<div style="width:100px;height:200px;background-color:Black;"> 
<iframe src="//player.bilibili.com/player.html?bvid=BV1ka4y1a7nq&page=1&as_wide=1&high_quality=1&danmaku=1" scrolling="no" border="0" frameborder="no" framespacing="0" allowfullscreen="true" style="position: absolute; width: 50%; height: 100%; left: 0; top: 0;"></iframe>
</div>  

从0到1python数据科学之旅