在博客园中嵌入视频
在博客园中嵌入视频,这里以B站视频为演示。
1. 添加样式
将以下样式放入博客园后台---->设置---->页面定制CSS代码
#cnblogs_post_body .video{
height: 0;
padding-bottom: 56.25%; /* 16:9 */
position: relative;
width: 100%;
}
#cnblogs_post_body .video iframe{
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
}
2. 获取视频
打开B站任意视频---->点击分享---->嵌入代码
<iframe src="//player.bilibili.com/player.html?aid=816641448&bvid=BV1pG4y1n7fD&cid=865834925&page=1" scrolling="no" border="0" frameborder="no" framespacing="0" allowfullscreen="true"> </iframe>
3. 使用方式
使用Markdown写文章时,添加 <div class="video">嵌入代码</div>
<div class="video">
<iframe src="//player.bilibili.com/player.html?aid=816641448&bvid=BV1pG4y1n7fD&cid=865834925&page=1" scrolling="no" border="0" frameborder="no" framespacing="0" allowfullscreen="true"> </iframe>
</div>