html - 当我有一个“位置：固定；”时该怎么办？标题和图像滑块“位置：相对；” 就在标题下方？

Question

我使用 CSS 属性制作了一个标题，position: fixed;并且在标题部分下方我包含了一个带有 CSS 属性的图像滑块，position: relative;. 我的问题是，当向下滚动页面时，图像往往会干扰页眉部分。请告诉我应该怎么做？

.header{position: fixed; background-color: black;}

.sliderbox{position: relative; width: 1200px; animation-duration: 20s; animation-name: slideranimation;}

@keyframes slideranimation{0%{left: 0px;} 20%{left:0px;}.....}  

标签： htmlcss

Answer 1

使用z-index选项使标题始终位于顶部，如下所示：

.header {
  z-index: 2; /* This value is sufficient if the other content does not have a z-index value. */
}