HTML如何哪一张图片浮在视频上方,视屏充当背景,这两个div该怎么布局...
发布网友
发布时间：2022-04-24 14:43
共5个回答
热心网友
时间：2022-05-13 15:44
使用定位来进行布局就可以了，将你的这个图片定位到这个位置上去。
首先你的视频用一个div装起来，然后视频和这个图片同级，把这个视频适应这个父级DIV的大小，然后图片根据父级DIV来进行定位就可以了，如果不显示就设置一下z-index:999;
热心网友
时间：2022-05-13 17:02
<style>
#videocontainer{ width: 100%; height: 100%; z-index: -999;position:relative}
#fullscreenvideo{width:100%; filter:brightness(0.5);}
#girlwu{ width: 5px; heignt:5px; position:absolute;top:200px;left:200px}
</style>
<div id="videocontainer">
<video id="fullscreenvideo" playsinline="" autoplay="" muted="" loop="">
<source src="https://cloud.video.alibaba.com/play/u/2153292369/p/1/e/6/t/1/d/hd/502446823.mp4">
</video>
<div id="girlwu"> <img src="https://s.alicdn.com/@img/tfs/TB1pDDmmF67gK0jSZPfXXahhFXa-2814-380.png" width=300px/></div>
</div>
热心网友
时间：2022-05-13 18:37
你好！浮在上面的div加在body标签中，设置好z-index为大于其它层，并设置好位置即可实现。供参考！追问你好，我试过了并没有实现，图片依然在视频下方
追答position:absolute;display:block。加上
热心网友
时间：2022-05-13 20:28
可以给外层div设置视频为背景
div{
background:url(你的视频路径)
}
热心网友
时间：2022-05-13 22:36
<div class="a">
<div class="b"></div>
<div class="c"></div>
</div>
.a{width:100%;margin:0 auto;position:relative}
.b{width:100px;height:100px;position:absolute;top:10px;left:10px}
.c{width:100%;height:500px;margin:0 auto}
b中放图片，c中放视频
