『html5、css3』将视频做为网页背景 超炫!
github项目地址:https://github.com/Ethan997/Video-background-page
想要实现这种效果很容易,只需要懂得H5的video, 按照我的步骤一步一步来就可以了~
首先要制作我们的页面,用到的是html5的新标签video
html :
<video autoplayloopposter="polina.jpg"class="bgvid"id="bgvid"> <source src="http://cdn.moji.com/websrc/video/video621.mp4" type="video/mp4"> </video>
css样式也没有什么好说的,只是要让视频充满屏幕、循环、无声、直接播放、隐藏按钮和不重复就可以了。
css:
body{ background-color:gray; background:url("http://cdn.moji.com/websrc/video/video621.mp4") no-repeat center0px; } video#bgvid { position: fixed; right:0; bottom:0; min-width:100%; min-height:100%; width: auto;height: auto;z-index:-100; background-size: cover; }
来源:https://blog.csdn.net/weixin_33696822/article/details/89661294
相关推荐
WebVincent 2020-06-06
行吟阁 2020-04-10
ShoppingChen 2020-06-25
爱好HtmlCssJs 2020-01-18
Jym 2012-07-05
tumobi 2016-12-08
一点一刻 2013-09-17
HandsomeHong 2010-08-13
Charliewolf 2019-11-10
WenFY的CSDN 2019-10-24
89510194 2019-10-22
nercon 2019-10-20
行吟阁 2019-10-22
zhangli 2014-11-12
jadechen00 2014-11-08