Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

position absolute fixed 定位基于什么来定位 #51

Open
lovelmh13 opened this issue Apr 10, 2021 · 0 comments
Open

position absolute fixed 定位基于什么来定位 #51

lovelmh13 opened this issue Apr 10, 2021 · 0 comments

Comments

@lovelmh13
Copy link
Owner

lovelmh13 commented Apr 10, 2021

元素会被移出正常文档流,并不为元素预留空间,而是通过指定元素相对于屏幕视口(viewport)的位置来指定元素位置。

元素的位置在屏幕滚动时不会改变。打印时,元素会出现在的每页的固定位置。fixed 属性会创建新的层叠上下文。

当元素祖先的 transform, perspective 或 filter 属性非 none 时,容器由视口改为该祖先。

关键词: 层叠上下文

总结:
对适口的定位,只适用于同一个层叠上下文中。 当形成了新的层叠上下文,比如父元素设置了 transform ,fixed 就会相对于有 transform 的父元素来定位

什么时候会形成新的层叠上下文:#37

补充:
经测试 contain、will-change 为 transform, perspective 或 filter 一样可以把容器由视口改为该祖先。

且 absolute 的定位的一样会被改变

扩展阅读:
层叠上下文

position

关于层叠上下文

@lovelmh13 lovelmh13 changed the title position fixed 定位基于什么来定位 position absolute fixed 定位基于什么来定位 Jun 20, 2021
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant