position 属性规定了元素的定位方法,有五个不同的位置值:
- static
- relative
- fixed
- absolute
- sticky
1、position的默认属性为static
2、relative相对定位:
a.元素开启相对定位后,如果不设置偏移量,那么元素的位置不会发生变化
b.元素定位是参照元素在文档流中的位置进行定位的
c.相对定位会提升元素的层级
d.相对定位不会使元素脱离文档流
e.相对定位不会改变元素的性质,块还是块,行内还是行内
3、fixed定位:
固定定位是一种绝对定位,唯一不同的是固定定位永远以浏览器的当前视窗进行定位。
4、absolute定位:
a.开启绝对定位后,如果不设置偏移量,元素的位置不会发生变化
b.开启绝对定位后,元素会从文档流中脱离
c.绝对定位会改变元素的性质,行内变成块,块的宽高会被内容撑开
d.绝对定位会使元素提升一个层级
e.绝对定位元素是相对于其包含块(上一级元素)进行定位的
5、sticky定位:
粘滞定位和相对定位的特点基本一致,不同的是粘滞定位可以在元素到达某个位置时将其固定。