标签：
对于一个刚刚接触css的新手而言，CSS的定位机制可能是最让人头疼的一件事情了， 接下来我们了解一下CSS的定位机制。
position：static | relative | absolute | fixed
适用于：除 <‘ display ‘> 属性定义为「table-column-group | table-column」之外的所有元素。
继承性：无。
归类总结一下定位的四种属性特点：
绝对定位：
1:单独标签设置定位的时候，以浏览器左上角为基准设置定位的。
2：盒子嵌套的时候，如果父盒子设置了定位，那么子盒子是以父盒子左上角为基准设置定位的。如果父盒子没有设置定位，那么子盒子以浏览器左上角为基准设置定位的。
3：设置了绝对定位的盒子，不占原来的位置。
4：设置了绝对定位的盒子可以实现模式的转换）
相对定位：
1：以自己左上角为基准设置定位。
2：相对定位占原来的位置
3：相对定位不能实现模式的转换
4：子绝父相（子元素设置绝对定位，父元素设置相对定位））
固定定位（1:固定定位不占位置；
2:可以实现模式的转换；
3:以浏览器为基准进行定位；
4:在屏幕上的位置固定不动。
静态定位：（元素框正常生成。块级元素生成一个矩形框，作为文档流的一部分，行内元素则会创建一个或多个行框，置于其父元素中。
尤其有一点要说明的是z-index：设置元素的堆叠顺序，只有设置了绝对定位或者相对定位的元素才会使z-index的值起作用。
那么定位和浮动又有什么关系和区别呢？
首先，定位和浮动都会使元素脱离标准文档流，定位往往会更加精确的使元素在某个特定的区域显示，而浮动则会有许多不确定性。这些不确定性往往会使页面产生一下超出我们预期范围的影响。
而且浮动往往是针对网页中盒子布局的时候使用，或者在li标签中。定位往往针对的是某个具体的元素或者块。
总而言之，不管白猫黑猫能够抓到老鼠的就是好猫，所以，不管浮动还是定位，能够达到预期效果的都是可取的。所以要多看多写代码，将这些结构布局熟记于心，才能更加流畅的运用。
标签：
原文地址：http://www.cnblogs.com/H5C3XXN/p/5858356.html
