css登录定位,CSS定位

CSS定位

relative相对定位

absolute绝对定位

fixed和sticky及zIndex

relative相对定位

position特性：css position属性用于指定一个元素在文档中的定位方式。top、right、bottom、left属性则决定了该元素的最终位置。

position取值：static( 默认) | relative | absolute | fixed | sticky

relative相对定位

如果没有定位偏移量，对元素本身没有任何影响，不使元素脱离文档流，不影响其他元素布局，left、top、right、bottom 是相对于当前元素本身身进行偏移的。

html代码

css代码

浏览器显示：

absolute绝对定位

使元素完全脱离文档流，内联元素支持宽高(让内联具备块特性)，块元素默认宽根据内容决定(让块具备内联的特性)；如果有定位祖先元素相对于定位祖先元素发生偏移，没有定位祖先元素相对于整个文档发生偏移(绝对、相对、固定)。

fixed和sticky及zIndex

fixed固定定位

使元素完全脱离文档流

使内联元素支持宽高(让内联具备块特性)

使块元素默认宽根据内容决定(让块具备内联的特性)

相对于整个浏览器窗口进行偏移，不受浏览器滚动条的影响

sticky黏性定位

在指定的位置，进行黏性操作。

z-index定位层级

默认层级为0

嵌套时候的层级问题

文章来源: www.oschina.net，作者：studywin，版权归原作者所有，如需转载，请联系作者。

原文链接：https://my.oschina.net/u/4226294/blog/3119695