15.（初级）CSS的float与position

一、浮动float

float特点：

        1、浮动，相对定位的，它根据一个元素的大小和其父节点容器的大小来构造这个元素在排版中与其他元素之间的关系，整个页面会随着浏览器的大小和分辨率的变化而改变。

        2、float:right/left是子块级元素流集合面向父级元素的定位，定位的关键词使用margin/padding。兄弟块元素之间进行相对的定位均基于移动后的新位置进行重新渲染，不可以重叠。

        3、当一个元素被浮动时，这个元素是挨着前一个元素，换行这取决于它相邻元素的位置。

        4、float后，元素变为行内块元素

二、定位position

用于精确定位元素。

属性：

static：

默认值。无特殊定位，对象遵循HTML定位规则  

relative：

作为子元素绝对定位（absolute）基础，对象不可层叠，但将依据 left ， right ， top ， bottom 等属性在正常文档流中偏移位置。

absolute：

将对象从文档流中拖出，使用 left ， right ， top ， bottom 等属性相对于其最接近的一个定位设置为相对定位（relative）的父对象进行绝对定位。如果未设置定位，则依据 body 对象。而其层叠通过 z-index 属性定义 

fixed：

将对象从文档流中拖出，固定于页面某处，不随页面滚动而滚动。

三、浮动float与定位position区别

float多用于布局，position多用于元素精确定位