上篇博客遗留了浮动和定位两个问题，只是对他们进行了简单的描述，今天仔细透透他们的底细，此篇为浮动篇。
浮动在这个CSS排版流行的年代发挥着越来越重要的作用，如同aline对定位网页元素的重要性一样，但它比aline更加功能强大。
float主要功能是帮助对象在网页中对齐的，通过不同的命令使对象左右浮动，直到遇到border、padding、margin或其他对象边缘为止。别看这简单的浮动，却可以为我们的排版设计出各种靓丽的风格，下面介绍几种。
我把它们归为了以下两大类：普通浮动和嵌套浮动。
普通浮动又分为none；left和right三种。
1、float：none。默认情况下，都是none的效果，这时的网页元素将按照他们自身的出现方式排列，一般是靠边对齐，按照文本流执行先后顺序排列。
代码：
不设浮动属性的情况
没有浮动
这就是我们介绍的没有设置浮动，即默认情况下的浮动效果
2、float：left。此时盒子浮动到左边，而文字却跑到了盒子右边！
对象左浮动 我现在左浮动（float:left）
现在是左浮动啦，看看是不是文字跑到了图片右边？？？
3、float：right。盒子浮动到右边，文字诡异地跑到了左边！
对象左浮动 我现在左浮动（float:left）
现在是右浮动啦，看看是不是文字跑到了图片左边？？？
好了，说完了最简单的，下面介绍下嵌套浮动。
1、负边界浮动：浮动对象会有负边界的情况，也就是浮动对象可能会漂浮到其所在父对象外边去，这有点像绝对定位的效果，但又与绝对定位不同，它还能影响它所在地方的文本流，请用标准浏览器FF看下面代码效果：
浮动对象有负边界的情况[请用标准浏览器查看]
负边界浮动效果如何？
右上方小盒子边界是margin:-10px 10px 0px 0px;，folat:right，这个效果还不错吧，这可不是用相对、或者绝对定位做出来的，部分文字还有环绕效果。如果在上面小盒子输标题，在这大盒子内部输内容，大家可以举一反三，多做出另外类似的效果来。
2、浮动子盒子宽度>常规父盒子。如果较宽的子盒子设置了浮动，在较窄的常规父盒子中会呈现出什么样的效果？
答案：浮动的子盒子不会影响到父盒子的宽度，超过的部分会越到父盒子外面，但不会影响到外边文本流的移动，而是覆盖在外边文字上边的。请用标准浏览器FF看下面代码效果：
子级元素宽大于父级元素宽的情况[请用标准浏览器查看] 我现在左浮动（float:left），我的宽小于子盒子，但它不会把我撑开，同时我设置了一定的左边界，目的是方便看到子盒子越出去的情况
我是子盒子，我的宽比父级要大，同时我的浮动是folat:right,所以右边靠在父级盒子的右边，而宽于父盒子的部分在大盒子左边越出。
此时，是子盒子宽度大于父盒子
3、浮动子盒子高度>常规父盒子。同上，浮动的子盒子高度若是超过了常规的父盒子，我们又想让父盒子能自动适应子盒子高度的变化，该怎么办？
答案：我们可以在父级内，浮动子盒子后边清除浮动，即
。请用标准浏览器FF看下面代码效果：
高度不能自适应[请用标准浏览器查看] 我是父盒子,我的高没有设定,但是我的子盒子高过我时,在标准浏览器中我的高不能自适应。
这个盒子是小盒子，它没有设定高度属性，其高度是随里面的文字的加多而自动升高的，但是当它的高度超过父级盒子时，在标准浏览器中并没有把父级撑高，这种情况与上面讲的子级宽度超过父级元素是一样的，但是这种高度自适度常是我们需要的，如何做到让高度自适应呢，常见的办法是在父级内加入以下样式：
清除掉与其同级小盒子的浮动。
注意：设置浮动对象是，一定要为其设定一个宽度，不然会有意想不到结果，即没有设定宽度而又没有内容的对象浮动后宽度会趋近于0。
下面顺带着说一下Clear吧，即清除的应用，他们二者是紧密相关的。
有时候我们浮动会带给我们额外的困扰，如牛腩新闻发布系统中的页脚块footer，随着内容区浮动的应用会使其跟着左浮动跑到右边，而我们想让其单独作为一行出现在最下边，这时就不得不用一个clear:both了。
另外，我们还可以利用它做出不同的浮动效果，如我们可以让一段文本流两遍出现浮动或者横排变竖排（清除左浮动即可）：
例：一段文本流两遍出现浮动。
让对象两边都有浮动对象存在 有时候我们浮动会带给我们额外的困扰，如牛腩新闻发布系统中的页脚块footer，随着内容区浮动的应用会使其跟着左浮动跑到右边，而我们想让其单独作为一行出现在最下边，这时就不得不用一个clear:both了。
有时候我们浮动会带给我们额外的困扰，如牛腩新闻发布系统中的页脚块footer，随着内容区浮动的应用会使其跟着左浮动跑到右边，而我们想让其单独作为一行出现在最下边，这时就不得不用一个clear:both了。有时候我们浮动会带给我们额外的困扰，如牛腩新闻发布系统中的页脚块footer，随着内容区浮动的应用会使其跟着左浮动跑到右边，而我们想让其单独作为一行出现在最下边，这时就不得不用一个clear:both了。
总结：好了，上边介绍的只是float的几种应用，不仅仅限于此。但无论是float还是clear，都是排版设计的一种方式。掌握这些技巧，是一个web有web开发基础人员的必备知识，作为CSS+p控制的一种手段，再结合我们的牛腩新闻发布系统前台，我们是否可以把界面设计的更有自己的风格呢？Ofcourse,yes！
