首先我们要了解css定位的几种不同的方式:
absolute relative fixed static inherit sticky(css3新增)
以上是css定位的几个属性值,那么具体的定位都是相对于什么的呢?
absolute(绝对定位)
相对于离它最近的有定位的元素,如果没有离它最近的有定位的元素,
那么最后相对于的就是浏览器窗口;
relative (相对定位)
我们写出一个元素,显示在浏览器窗口中,这个时候再加相对定位,
就是相对于原先默认的位置;
fixed ( 固定定位 )
一般都是相对于浏览器窗口,可以看做是相对于浏览器窗口的绝对定位;
static ( 无定位 )
不设置定位,就是没有定位,按默认的布局显示;
inherit ( 继承 )
继承父元素的定位属性,其父元素是相对定位,那么子元素也是相对定位;
sticky (粘性定位)
简单来说就是 相对定位+固定定位,可以实现导航栏固定定位效果;