问题：在不用插件的情况下，用B站官方的嵌入代码方式引入视频，视频屏幕很小
如下：
解决办法
办法1、修改width和height
<iframe width=200 height=200 class="bilibili" src="//player.bilibili.com/player.html?aid=212464091&bvid=BV1xa411t7JK&cid=553318499&page=1" scrolling="no" border="0" frameborder="no" framespacing="0" allowfullscreen="true"> </iframe>
通过修改width和height来调整视频大小，但是换成不同的设备无法正常显示.
办法2、添加css自定义代码
- 使用
@media属性，对不同屏幕大小的设备，设置宽度和高度 @media可以查询到设备属性, 比如：屏幕高度、设备方向（如移动设备横屏）、可视窗口的宽高、屏幕解析度等
修改方法：
- 以
matery主题为例， 找到主题文件夹下的/hexo-theme-matery/source/css/my.css文件，在文件中添加如下代码：
/* Here is your custom css styles. */
/*哔哩哔哩视频适配*/
.bilibili {
position: relative;
width: 100%;
}
@media only screen and (max-width: 767px) {
.bilibili {height: 15em;max-width: 25em;}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.bilibili {height: 20em;max-width: 30em;}
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
.bilibili {height: 30em;max-width: 40em;}
}
@media only screen and (min-width: 1200px) {
.bilibili {height: 40em;max-width: 50em;}
}
- 在B站嵌入代码中添加
class="bilibili"属性，如下：
<iframe class="bilibili" src="//player.bilibili.com/player.html?aid=212464091&bvid=BV1xa411t7JK&cid=553318499&page=1" scrolling="no" border="0" frameborder="no" framespacing="0" allowfullscreen="true"> </iframe>
效果如下：
