公告

记录一下自己学习和生活中的所见所闻

Skip to content

插入在线视频

语法

md

<iframe 
style="width:100%; aspect-ratio:16/9; margin-top: 2em;" 
src="https://www.youtube.com/embed/bzyMLoSwYvk" 
frameborder="0" 
allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" 
allowfullscreen>
</iframe>


<iframe 
style="width:100%; aspect-ratio:16/9; margin-top: 2em;" 
src="//player.bilibili.com/player.html?bvid=BV1YptMeMEcV" 
frameborder="0" 
allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" 
allowfullscreen>
</iframe>

效果

快捷实现

上面这种方式在复杂了,我们借助Obsidian中的一个插件可以快速实现

安装插件

image.png

使用

我们首先将视频的在线地址复制到md中,然后选中地址,ctrl+p

https://www.youtube.com/embed/bzyMLoSwYvk

然后选择第一个命令

image.png

点击ok

image.png

链接就会变成下面这个代码

md

<iframe src="https://www.youtube.com/embed/bzyMLoSwYvk" allow="fullscreen" allowfullscreen="" style="height:100%;width:100%; aspect-ratio: 16 / 9; "></iframe>

然后就会实现下面这个效果

image.png