求解 css sticky 定位代码的奥秘
你提供了一段 CSS 代码，其中使用了 sticky 定位，并困惑于为什么你的 Part3 元素会出现这种效果。
根据你给出的代码，Part3 元素嵌套在 side-navbar 中，而 side-navbar 是 main 的子元素，main 又包含在 app-container 中。app-container 设置了滚动条。
根据 CSS 规范，sticky 定位相对于它最近的有滚动机制的祖先元素起作用。在这个例子中，app-container 是 Part3 元素最近的有滚动机制的祖先元素，因此 sticky 定位相对于 app-container 生效。
也就是说，当页面滚动时，Part3 元素将被固定在 app-container 的顶部，即使它位于 main 元素的内部。
立即学习“前端免费学习笔记（深入）”；
因此，代码中 sticky 定位的正确生效是因为 Part3 元素的最近滚动机制祖先元素是 app-container，而不是它的直系父元素 main 或 side-navbar。
以上就是使用 CSS sticky 定位时，为什么元素会固定在 app-container 而不是 main 或 side-navbar 顶部？的详细内容，更多请关注【创想鸟】其它相关文章！
版权声明：本文内容由互联网用户自发贡献，该文观点仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容， 请发送邮件至253000106@qq.com举报，一经查实，本站将立刻删除。
发布者：PHP中文网，转转请注明出处：https://www.chuangxiangniao.com/p/2808056.html
