1.相对定位relative（占位置）
仍处于标准文档流中
相对于原来位置进行偏移
相对定位的性质：不脱标、老家留坑、形影分离（影子出去了，但本质不动）
用途：一般用于微调元素、绝对定位的参考
2.绝对定位absolute（不占位置）
相对于浏览器窗口进行定位；当拖拽页面滚动条时，该元素随其一起滚动；
1.完全脱离标准文档流
2.不会对它的兄弟造成影响
3.当一个元素设置绝对定位，没有宽度时，元素的宽度会根据内容进行自动调节
4.如果父级没有定位，儿子绝对定位就以<html>定位，即屏幕左上角为基准进行移动定位
5.如果父级有定位，就找最近的父级进行定位
所以一般是“子绝父相”。即父亲相对定位，儿子绝对定位。儿子相对于父级元素进行定位。用于CSS精灵图定位、小图标定位。
绝对定位的性质：脱标（所有的标准文档流在绝对定位后就都不遵守了，就不区分所谓的行内元素块元素，不需要display:block;就可以直接设置宽高了）
用途：用于“压盖”（一个东西压在另一个东西上面）、用于轮播图两侧的三角形
绝对定位的盒子居中例如：
width: 600px;
height: 60px;
position: absolute;
left: 50%;/*盒子左边框会贴着屏幕的中心线*/
margin-left: -300px;/*总宽度的一半（注意是否有padding）*/3.固定定位position: fixed;：（占位置）
相对于浏览器窗口进行定位；当拖拽页面滚动条时，该元素不会滚动；
比如返回顶部图标在右下角固定住，不会随浏览器变化而改变位置。（IE6不兼容固定定位）
性质：脱离标准文档流
用途：返回顶部、顶部通栏、弹出框
8634
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
