htmlcss中的float问题

float 是浮动的意思。

使用float 意思就是网页不再是一个平面的，而是一个有上下层次的网页，只不过从屏幕上看相当于俯视去看一个网页，看出来的效果仍然是一个平面，但是侧视图去看的话就变成了上下层的结构，这样才会出现不同的div在不同的平面上，所以在你俯视去看的时候，他们可以并在一起，感觉上是一个平面，其实是两个平面。

不知道你能不能懂

一般情况下是要清除浮动的，不然会影响下面标签的排版。浮动就是，打个比方说，你想一行放上两个div，但是若是不加浮动，那么一行只能放一个div,加上浮动就可以放2个。另一方面就是若是标签加了浮动，在ie6里，margin的值会变成双倍。若是要解决则需要加上display:inline

相对定位，在其默认显示的位置的基础上，通过上下左右四个参数设置偏移一定的距离，但是仅仅是显示出来的效果偏移了，但它实际还占用着原来的位置

如果div的position设置了relative属性，但是没有指定偏移量，则默认为position：static。

绝对定位， 浮动元素脱离文档流，偏移后元素不再占用了原来的位置，原位置将由后面的元素取代，默认以除static（一般元素默认的定位都是static）定位的第一个元素为参考进行定位 ，元素的位置通过top，right，bottom，left属性进行规定，若外部没有其他定位元素，则以浏览器左上角为参考原点。

例如：如果想指定元素div1作为参考原点，则div1应该加上position：relative（所以absolute常搭配relative使用）

浮动元素脱离文档流 ，元素水平方向浮动起来，只能向左或向右移动，通过float:left（right）设置左右浮动

设置浮动后出现两个问题：

1、设置浮动后周围元素会重新排列

2、怎么实现垂直排列

解决上面的问题需要用到清理浮动，关键字clear

清除浮动的关键字是clear，官方定义如下：

用法 ：

clear : none | left | right | both

含义：

none : 默认值。允许两边都可以有浮动对象

left : 不允许左边有浮动对象

right : 不允许右边有浮动对象

both : 不允许有浮动对象

注意 ：clear属性只能影响元素本身，不能影响其他元素

假如div1和div2均设置了向左浮动，则两个元素水平并列向左排列分别为div1,div2，如果想div2独占一行，则需要给div2设置clear:left,表示清理div2左侧浮动（实际div1浮动并未清理），div2下移一行。

---