定位

122 阅读1分钟

口诀 :子绝父相

相对定位relative,

1.相对于原来的位置

2.原来的位置继续占有

绝对定位absolute,

1.完全不占位置

2.相对于父元素,

固定定位fixed,

1.以浏览器的可视窗口为参照点移动元素。

2.固定定位不再占有原先的位置

静态定位static。

很少用到

粘性定位(sticky)

粘性定位的特点:

1.以浏览器的可视窗口为参照点移动元素(固定定位特点)

2.粘性定位占有原先的位置(相对定位特点)

3.必须添加 top 、left、right、bottom 其中一个才有效

跟页面滚动搭配使用。 兼容性较差,IE 不支持。

  • 注意:
  1. 边偏移需要和定位模式联合使用,单独使用无效
  2. topbottom 不要同时使用;
  3. leftright 不要同时使用。