CSS里Postion几个取值relative、absolute、static、fixed的区别和用法

时间:2022-02-22 06:18:08

---恢复内容开始---

static:静态定位,也是postion的默认值,没有定位,元素出现在正常的流中,忽略top\bottom\left\right或者z-index声明。

relative:相对定位,生成相对定位的元素,通过top\bottom\left\right的设置相对于其自身的位置进行定位。可以通过z-index进行层级分级。

absolute:绝对定位,生成绝对定位的元素,相对于static定位以外其他定位(如relative\absolute\fixed)的第一个父元素进行定位,如果父元素没有定位则相对于浏览器窗口定位,可以通过z-index进行层级分级。

fixed:固定定位,生成绝对定位的元素,相对于浏览器窗口进行定位。元素的位置通过left\top\right\bottom属性进行规定。可以通过z-index进行层级分级。

fixed属性是相对于浏览器窗口定位且随窗口的滚动而移动,而absolute是相对于浏览器窗口定位但不随窗口的滚动而移动。

---恢复内容结束---