Html 视频播放器控件位于导航栏上方

所以我有一个有粘性标题的网站。该网站还包含一段视频。当我向下滚动并浏览视频时，视频控件位于标题的顶部。因此，我希望标题位于视频控件上方

.header{
填充：无；
字体大小：20px；
颜色：#FFFFFF；
/*边框：1px橙色虚线*/
位置：固定；
高度：90px；
宽度：100%；
文本对齐：居中；
背景色：#005a84；
溢出：隐藏；
排名：0；
列表样式类型：无；
}

那么给它一个更高的z指数


.header{
填充：无；
字体大小：20px；
颜色：#FFFFFF；
/*边框：1px橙色虚线*/
位置：固定；
高度：90px；
宽度：100%；
文本对齐：居中；
背景色：#005a84；
溢出：隐藏；
排名：0；
z指数：5；
列表样式类型：无；
}


尝试为您的header类指定一个z索引，如下所示：

    z-index: 1;

您可以使用z-index css属性修复此问题。给标题一个比视频播放器更高的z索引，它将出现在它的顶部

例如：

.header{
z指数：3；
}

。视频播放器{
z指数：1；
}
您缺少
.header
的
z-index
属性。
你的标题隐藏在视频播放器后面的原因是因为它的使用位置不同于静态（例如，绝对、相对、固定），所以它现在可以“分层”，你需要告诉浏览器它应该在哪里

更多信息

这是你工作的例子