无法在不隐藏标题的情况下添加幻灯片

Question

我试图通过在顶部显示标题而不淡化来实现幻灯片放映。 我无法做到这一点。有人帮我改变代码，以便在标题下开始幻灯片放映

这是我的codepen的链接

https://codepen.io/arunkayathi/pen/EbxpEv

#landing-header {
  background-repeat: no-repeat;
  background-size:100%;
  z-index: 1;
  position: relative;
  width:340px;
  height:174px;
  text-align: center;
  margin:0 auto;
  padding-top: 37vh;
}
#landing-content{
  padding:40px 0;
}
#landing-header{
  color:white;
}
.slideshow {
  position: fixed;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: 0;
  list-style: none;
  margin: 0;
  padding: 0;
}
.slideshow li {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  background-size: cover;
  background-position: 50% 50%;
  background-repeat: no-repeat;
  opacity: 0;
  z-index: 0;
  animation: imageAnimation 50s linear infinite;
}

请点击链接，找到相应的完整代码

Answer 1

您只需要在nav元素上添加z-index。

将此添加到您的css

nav  {
  z-index:10;
}