CSS布局浮动和定位属性的区别

标签：line   大型   clear   input   容器   display   效果   排列   元素   

float: left|right; 可以自动排列自动折行, 但需要clear来配合清除浮动;display: inline-block 有些时候可以替代float实现相同的效果.

        position: absolute|relative; 要配合top,left等定位;

使用：
　　position: absolute会导致元素脱离文档流，被定位的元素等于在文档中不占据任何位置，在另一个层呈现，可以设置z-index。PS的图层效果就是position: absolute。

　　float也会导致元素脱离文档流，但还在文档或容器中占据位置，把文档流和其它float元素向左或向右挤，并可能导致换行。图片的文字环绕布局效果就是float。

　　display的inline-block不脱离文档流，将block元素当作大型字符嵌入文档流内，类似于img或者input默认效果。

CSS布局浮动和定位属性的区别

标签：line   大型   clear   input   容器   display   效果   排列   元素   

原文地址：http://www.cnblogs.com/moije/p/6790600.html