背景视频滤镜隐藏了Div

Question

在我们的背景视频中添加任何滤镜时，div叠加移动到视频后面（变为隐藏）。这是一个小提琴，显示带有文字叠加的背景视频： https://jsfiddle.net/dyrepk2x/2/

将以下webkit过滤器添加到视频css中，如下所示：

video {
width: 100%;
height: 100%;
-webkit-filter: brightness(.5); /* add these filters */
filter: brightness(.5); /* this line works too */
}

视频叠加层在视频后面消失。如何设置过滤器并将叠加层保留在视频顶部？

Answer 1

尝试设置任何高于1的z-index

z-index: 5;

在这里为我工作： https://jsfiddle.net/dyrepk2x/3/