HTML视频背景

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<meta name="description" content="视频背景"/>
<title>视频背景</title>
  <style>
    html{height:100%;}
body{height:100%;margin:0;}
video{width:100%;height:100%;object-fit:cover;vertical-align:bottom}
#main{position:absolute;top:0;width:100%;height:100%;}
    </style>
</head>
<body>
<video src="video/bg.mp4" autoplay muted loop></video>
<div id="main">
<h1>背景视频</h1>
  <p>类似于抖音官网……在看直播时学到的,记了下来,当然这只是的基本结构...但是没有足够的时间去看完,所以...</p>
  </div>
  </body>
</html>

效果图
视频背景
预览地址:http://blog.loness.cn/html/video

最后修改:2019 年 08 月 15 日 09 : 57 PM
如果觉得我的文章对你有用,请随意赞赏

发表评论

3 条评论

  1. meo

  2. 猫客工作室

    一口气阅读了好几篇,这篇写得最好!

  3. 今日新闻

    文章不错支持一下吧