CSS定位总结

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定位：

粘滞定位和相对定位的特点基本一致，不同的是粘滞定位可以在元素到达某个位置时将其固定。