css位置:固定;消失的问题[关闭]。

问题描述 投票:0回答:1

当ı设置位置:固定;div消失,所以ı可以做什么?

代码前前一页

代码后 页后

css
1个回答
0
投票

我想我知道会发生什么,因为我可以从截图中看到。

为什么会这样?这是因为当你将一个元素设置为 "固定 "时,它们的位置不再是相对于它们的父元素而言,而是相对于html文档而言。它是相对于html文档的。你也可以说它是从 "正常的 "contentdocument流程中移除的。

由于我错过了一些关于你想要实现的信息,我的建议是在属性 "position "中使用 "sticky "值。这将使它保持在文档流内部,并且相对于它们的父级文档是 "固定 "的。如果你想实现这个目标,我建议你阅读一下,因为使用它可能很棘手。

举个例子。

.container {
    width: 100%;
    height: 90rem;
}

.container-child {
    position: sticky;
    top: 0; /* Needed, because this way you'll let the browser know when to get sticky when the viewport(top) of the user 'touches' the element. */
}

Source: MDN position: sticky MDN position: sticky

要注意的是,在某些浏览器中,浏览器的支持是有限的,或者说是奇特的。

我还建议为你的问题设置一个codepen例子,并描述预期的行为。这样更容易理解和复制你的问题。) https:/codepen.io

© www.soinside.com 2019 - 2024. All rights reserved.