我之前仿做百度首页，将整个页面整体布局完并写好之后，发现我的网页中的部分块会随着网页大小的变化而移位。我尝试了很多方法，调完之后，还是发现有一个块始终没有办法乖乖到我预想的位置。如下所示：
div_foot这个块，按我的想法是应该在百度一下这个框下边的，但是不知道为什么总是在上面，如果我调整margin-top的数值，它也是以顶端为基准。在仔细查看了代码之后，终于发现，原来它前边的div都写了float，变成了浮动的块，所以它直接以顶端为基准来调整高度。
于是我给div_foot也加了float，由于这个块的width是100%；搜索框的width也是100%；所以它直接就跟在了搜索框这个块的下面。再调整一下margin，终于到了我想要它待着的位置。
如下图：
写完这个网页，在页面布局中经常用到float标签，先前做了两个简易的网页，对它都不是很理解。今天倒回去优化之前做的百度首页使我对它有了新的认识，随后我又上网查了一些float的文章，结合在网上查到的一些知识，总结了float的一些小猫腻。
float的影响对象主要分为三类：自身、兄弟元素、父元素。
1、对自身的影响
float作用于块，因为只有块元素才会有物理属性。如果是对行内元素使用float，那么行内元素也会变成块级元素。当float作用于块时，会对块的高度产生影响。div的宽度默认宽度是width：auto即自适应，在默认不带float的情况下，它的宽度会自动调整为最大化，而带float则正好相反，即元素一旦浮动起来之后，元素宽度将由内容来决定。。（注：不论是否带float，div的默认高度都是自动调整为最小化。）
此外，当一个元素设置float属性之后，它将具备inline-block属性，即该元素呈递为内联元素。
2、对兄弟元素的影响
接上文所述，当一个元素设置为float后，将呈递为内联元素。此时它将不会独占一行，会“浮起来”，与其他元素不在一个层面。其它盒子会无视它的存在，但是会为这个元素让出位置，环绕在它周围。因为浮动元素“浮起来了”，没有设置float的块元素则会自动填充浮动元素留下的空间，浮动元素位于这些元素的上方，发生元素重叠，也就是许多人经常遇到的块元素被部分隐藏的原因。这也是我写这个百度首页时div_foot遇到的问题。而想要消除浮动元素对其他元素的影响，可以通过clear来消除浮动。（注：大部分是添加一个空div来消除浮动影响。）
3、对父元素的影响
float具有破坏性， 当父元素所包含的元素都为浮动元素时，父元素的高度会塌陷，即父元素的高度，是以未浮动元素的高度为准，由于浮动元素会脱离文档流，所以会导致元素不占据空间.那么该父元素的高度就是 0 。如果想要消除这个影响，可以直接设置父元素的高度，或者将父元素也设置为浮动（对后续元素会产生影响），为父元素的overflow设置为hidden或者auto（会隐藏溢出的内容），当然啦，也可以用上文说到的方法——设一个空的div，clear一下就行。此外，父元素中，如果显示不下所有的已浮动子元素，最后一个会换行，如果块的高度不一致，那么当浮在前面的块的高度大于自身高度的时候，有可能会被卡住。
以上就是我现在对float的认识，如果的大家有什么好的见解，或者对我总结的有异议，欢迎大家留言，我们一起学习呀。