position有以下四个属性值:
1、static:静态定位,默认值,元素出现在正常流中(忽略top,right,bottom,left和z-index);
2、relative:相对定位,根据top、right、bottom,left设置相对于其原本位置进行定位;可通过z-index进行层次分级;
脱离正常的文本流中,但其在文本流中的位置依然存在;
如果父级有Padding属性,那么就以内容区域的左上角为原点,进行定位。
3、absolute:绝对定位,相对于static以外的第一个父级元素进行定位,可根据top、right、bottom、left来设置位置,可通过z-index进行层次分级;
脱离正常文本流,但与relative的区别是其在正常流中的位置不再存在;
以父级左上角为原点进行定位,跟父级padding值无关。
4、fixed:固定定位,相对浏览器窗口进行定位,可根据top、right、bottom、left来设置位置,可通过z-index进行层次分级;
若想将一个absolute元素固定在其父级元素内,必须满足:
(1)、父级元素设定了position属性;
(2)、自身设定top、right、bottom、left;