HTML页面中引入视频的好方法

在搭建个人网站时,我们租用的个人云服务器通常内存有限,带宽有限。想在HTML中引入视频,如果视频放在本地会占用大量的存储空间,在线播放的时候也会z占用本来就很小的带宽。一个好的解决办法就是把我们想要展示的视频放到某某视频平台上,让他们替我们保存。我们只需要在用到的时候引入即可。视频平台提供了这样的功能,方便我们引入。

以 youku 和 bilibili 为例。

优酷:上传完成后点看想要用的视频,鼠标放到分享按钮,会弹出一些选项,点击“复制通用代码”(优酷)、“复制嵌入代码” (bilibili)将代码粘贴到我们自己的html页面中即可。

bilibili:

代码:

<!DOCTYPE html> <!-H5标准->
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>video</title>
</head>
<body> 
   <h1>引入视频:::</h1>
    <iframe src="//player.bilibili.com/player.html?aid=586241270&bvid=BV13z4y1S7dB&cid=281386260&page=1" scrolling="no" border="0" frameborder="no" framespacing="0" allowfullscreen="true" width="500" height="500"> </iframe>
</body>
</html>

效果:

  • 8
    点赞
  • 46
    收藏
    觉得还不错? 一键收藏
  • 2
    评论
评论 2
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值