在写代码的过程中每天都在用到position这个属性，但是当被问到他们的类型有什么区别的时候，却讲不清楚，今天就梳理一下。
这个很好理解，是默认值，没有定位，元素正常出现在文档流中。
这个也很好理解，生成绝对定位元素，元素相对浏览器窗口进行定位。
生成相对定位元素，top、left、right、bottom相对元素原来的位置进行定位，但是占据的空间是未偏移之前占据的空间。
生成相对定位元素，其相对定位的参照是最近的定位不是static的父元素进行定位。
sticky是position: relative和position: fixed的结合体——当在屏幕内的时候，表现为relative，当将要移出屏幕的时候，表现为fixed。
sticky.gif
但是要实现这个粘滞效果，要注意一下几点：
1、直接父元素不能设置固定高度；
2、父元素的overflow必须是visible；
position:absolute and position:relative 的理解 Absolute，CSS中...
css粘性定位position：sticky问题采坑position: sticky 详解（防坑指南）CSS中po...
absolute position和relative position:https://css-tricks.co...
Css pos position:relative; pos:s position:static; pos:a p...
CSS 中的层级概念 CSS中分为3层 最上层：定位元素层（position:relative、position:...
position:sticky是一个css3属性，类似position:relative和position:fix...
垂直水平居中 css: position几个属性 position: relative, absolute, fi...
CSS position属性 CSS display属性 CSS float属性 （引用：https://www...
CSS Position定位理解：https://www.runoob.com/css/css-positioni...
关于CSS position，来自MDN的描述： CSS position属性用于指定一个元素在文档中的定位方式。...
本文标题：CSS position
本文链接：https://www.haomeiwen.com/subject/arjqbctx.html
网友评论