CSS定位总结

固定定位

1. 固定定位 相对于什么做定位 浏览器

   div {
       position: fixed;
       top:0;
       left:0;
   }
   

2. 固定(绝对定位)定位 3个特点

   1. 脱标
   2. 会重叠 z-index
      1. 决定谁先显示
   3. 变成行内块

3. 元素的水平垂直居中

   1. 定位
   2. top left 50%
   3. margin 负 自身宽度和高度的一半

绝对定位

div{
    position:absolute;
}

它的参照物是什么：

1. 使用了 相对定位或者绝对定位或固定定位的 祖先元素 （万一找不到）
2. 相对于浏览器做定位 （固定定位了）

相对定位

• 相对于原来的位置移动元素

• 最大的作用： 给子元素做参照物使用而已 。

div{
    position:relative;
}

粘性定位

• 浏览器的可视窗口为参照点移动元素（固定定位特点）
• 粘性定位占有原来的位置（相对定位特点）
• 必须添加top,left,right,bottom其中一个才有效