我正在制作一个网站，我有一个“粘性元素”和下面的一堆图像，问题是，如果我向下滚动，“粘性元素”就会位于图像后面，因此变得不可见。我想在向下滚动时使“粘性元素”可见。我尝试过“z-index” CSS 属性，但它不起作用（也许我没有正确使用它）。<style>div{ position: sticky;}</style><body> <div> "Sticky element" </div><br> <img src="https://www.cecidiomas.es/images/cecidiomases/684-thinking-of-getting-a-cat-international-cat-care-3435.png"><br> <img src="https://www.cecidiomas.es/images/cecidiomases/684-thinking-of-getting-a-cat-international-cat-care-3435.png"></body>
2 回答
郎朗坤
TA贡献1921条经验 获得超9个赞
如您所见，您不需要 z-index 来实现此目的，也许您忘记将 top 添加到粘性元素？我还在元素中添加了粉红色背景，以便更容易看到，但这当然不是必需的
仅当后面的元素也定义了 z-index 时，才需要 z-index。
#sticky{
position: sticky;
top: 0;
background: pink;
}
<div id="sticky">
"Sticky element"
</div>
<br>
<img src="https://www.cecidiomas.es/images/cecidiomases/684-thinking-of-getting-a-cat-international-cat-care-3435.png">
<br>
<img src="https://www.cecidiomas.es/images/cecidiomases/684-thinking-of-getting-a-cat-international-cat-care-3435.png">
小唯快跑啊
TA贡献1863条经验 获得超2个赞
如果它对您有帮助，您也可以尝试一下，因为您没有提到为什么要使用粘性。所以这个解决方案的工作原理与你想要的完全相同。
<style>
div{
position: fixed;
background-color: beige;
width: 100%;
top: 0;
left: 0;
padding: 10px 10px;
}
</style>
<body>
<div>
"Sticky element"
</div>
<br>
<img src="https://www.cecidiomas.es/images/cecidiomases/684-thinking-of-getting-a-cat-international-cat-care-3435.png">
<br>
<img src="https://www.cecidiomas.es/images/cecidiomases/684-thinking-of-getting-a-cat-international-cat-care-3435.png">
</body>
- 2 回答
- 0 关注
- 91 浏览
添加回答
举报
0/150
提交
取消