手机版 | ------------全站资源有,统一解压码,解码平台,请点这里 ------------ 设首页 | 加收藏
当前位置: 网站首页 > 教程知识 > 文章 当前位置: 教程知识 > 文章

如何在博客园中插入视频、音频、网页

时间:2020-03-05    点击: 次    来源:网络    作者:佚名 - 小 + 大

相信很多人都有这样的经历,当我们想在博客中插入视频、音频或者其他网页时,往往效果并不是我们想要的,因此分享一个小技巧:

1. iframe

<iframe>是HTML语言的一个标签,<iframe>标签定义了一个内联框架,这个内联框架被用来在当前HTML文档中嵌入另一个文档(PS: 另一个文档可以是一个视频链接、音频链接或者一个网页等)。

2. 使用方法

2.1 设置默认编辑器
  1. 首先打开https://i-beta.cnblogs.com/
  2. 点击选项,在默认编辑器中选择TinyMCE
  3. 点击确定
2.2 插入iframe
  1. 新建一篇随笔
  2. 编译HTML图标
  3. 点击上图红框中的图标
  4. HTML编辑器
  5. 插入以上代码,点击更新,保存随笔,查看效果
2.3 效果展示
  1. 博客园中插入视频
  2. 博客园中插入网页
2.4 通用代码

示例里面是插入了一个视频,我们也可以插入一个网页。下面给出了插入视频和网页的样例,如果需要插入其他的媒体,只需要修改iframe标签中的src属性。(PS: 下面的代码同样适配移动端)

1.插入一个视频 <div style="position: relative; padding: 30% 45%;"> <iframe style="position: absolute; width: 100%; height: 100%; left: 0; top: 0;" src="https://player.bilibili.com/player.html?cid=145147963&aid=84267566&page=1&as_wide=1&high_quality=1&danmaku=0" frameborder="no" scrolling="no"></iframe> </div> 2.插入一个网页 <div style="position: relative; padding: 30% 45%;"> <iframe style="position: absolute; width: 100%; height: 100%; left: 0; top: 0;" src="https://www.lovestu.com/api/project/cnmapyinqing/obj.php" frameborder="no" scrolling="no"></iframe> </div>

上一篇:字体大小自适应纯css解决方案【转】

下一篇:css语法特点和引入页面三种方式与其优先级

浙ICP备14024822号  |   QQ:79720816  |  地址:蚂蚁分享-一个只做有用的分享。  |  电话:13388629007  |  
Copyright © 2020 天人文章管理系统 版权所有,授权www.antqq.com使用 Powered by 55TR.COM