CSS3定位

CSS3定位

定位=定位模式+边偏移

子绝父相

相对定位

1. 移动位置参照原来位置
2. 不脱标，保留原来位置

绝对定位

1. 如果没有祖先元素或祖先元素没有定位，则绝对定位盒子参考浏览器
2. 如果祖先有定位（相对、绝对、固定），则参考最近有定位的元素
3. 脱标

固定定位

1. 以浏览器可视窗口为参照
   • 与父元素无关
   • 不随滚动条滚动
2. 固定定位不再占有原先位置

粘性定位

1. 以浏览器可视窗口为参照（固定定位）
2. 粘性定位占有原先位置（相对定位）
3. 必须添加top/left/right/bottom至少一个才有效

定位特殊特性

绝对定位和固定定位也和浮动类似

1. 行内元素添加绝对或者固定定位，可以直接设置高度和宽度。
2. 块级元素添加绝对或者固定定位，如果不给宽度或者高度，默认大小是内容的大小。

脱标的盒子不会触发外边距塌陷

绝对定位（固定定位）会完全压住盒子