我试图通过在顶部显示标题而不淡化来实现幻灯片放映。 我无法做到这一点。有人帮我改变代码,以便在标题下开始幻灯片放映
这是我的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;
}
请点击链接,找到相应的完整代码
答案 0 :(得分:1)
您只需要在nav元素上添加z-index。
将此添加到您的css
nav {
z-index:10;
}