Question

HTML如何哪一张图片浮在视频上方，视屏充当背景，这两个div该怎么布局？

CSS#fullscreenvideo{ width:100%; height:100%; position:static;}#videocontainer{ width: 100%; height: 100%; filter:brightness(0.5); z-index: -999;}#girlwu{ width: 5px; heignt:5px; z-index: =2}源代码<div id="videocontainer"> <video id="fullscreenvideo" playsinline="" autoplay="" muted="" loop=""> <source src="漫威：未来之战 5.0.mp4"> </video> </div> <div id="girlwu"> <img src="图标.jpg" width=100px height=100px /> </div>

Answer 1

使用定位来进行布局就可以了，将你的这个图片定位到这个位置上去。
首先你的视频用一个div装起来，然后视频和这个图片同级，把这个视频适应这个父级DIV的大小，然后图片根据父级DIV来进行定位就可以了，如果不显示就设置一下z-index:999;

Answer 2

<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/50264446823.mp4">
</video>
<div id="girlwu"> <img src="https://s.alicdn.com/@img/tfs/TB1pDDmmF67gK0jSZPfXXahhFXa-2814-380.png" width=300px/></div>
</div>

Answer 3

你好！浮在上面的div加在body标签中，设置好z-index为大于其它层，并设置好位置即可实现。供参考！

追问

你好，我试过了并没有实现，图片依然在视频下方

追答

position:absolute;display:block。加上

Answer 4

可以给外层div设置视频为背景
div{
background:url(你的视频路径)
}

Answer 5

<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中放视频