首先，打开html编辑器，新建html文件，例如：index.html。在index.html中的标签中，输入css代码：img{float：left；}。浏览器运行index.html页面，此时div标签中的左侧图片与右侧图片通过css调整为了浮动而顶部对齐了。
成都创新互联自2013年起，先为莱州等服务建站，莱州等地企业，进行企业商务咨询服务。为莱州企业网站制作PC+手机+微官网三网同步一站式服务解决您的所有建站问题。
知道了 float 带来的不好的地方，则需要去清除浮动带来的影响。
值 描述 left 元素向左浮动。right 元素向右浮动。none 默认值。元素不浮动，并会显示在其在文本中出现的位置。
1、我们在CSS 中很多时候会用到浮动来布局。常见的有 float：left 或者 float：right 。
2、学习CSS弹性布局之后，仍建议了解和掌握浮动和定位。虽然弹性布局可以在大多数情况下取代浮动和定位，但它们仍然有其独特的用例和好处。- **浮动**：浮动元素在页面上移动到左侧或右侧，并允许其他元素在其旁边或下方浮动。
3、例如03： 全部设置左浮动，会从左到右依次排列。
1、-moz-opacity：0.5； opacity：0.5；/*遮罩层一定要设置背景，否则起不到遮罩作用。
2、我们在CSS 中很多时候会用到浮动来布局。常见的有 float：left 或者 float：right 。
3、第三种方法也不是很常用，但是大家要知道clear：both这个东西。通过在所有浮动元素下方添加一个clear：both的元素，可以消除float的破坏性。
4、引言从本节开始，就进入本系列的第二个部分？css和html的结合？说白了就是选择器。CSS中定义了样式，如何将这些样式设置到相应的html节点上？就不得不通过选择器。
5、横向排版、或者多列布局。这样的使用是正确的，大部分人都这样使用，bootstrap的栅格系统也是使用了float来实现的，并且在css3被普及之前，多列布局的最佳解决方案也是使用float？要不然你就用table。
1、float属性float，顾名思义就是浮动，设置了float属性的元素会根据属性值向左或向右浮动，我们称设置了float属性的元素为浮动元素。
2、属性定义及使用说明float属性指定一个盒子（元素）是否应该浮动。注意： 绝对定位的元素忽略float属性！默认值：none继承：no版本：CSS1JavaScript 语法：object.style.cssFloat=left属性值left元素向左浮动。right元素向右浮动。
3、定义和用法 float 属性定义元素在哪个方向浮动。以往这个属性总应用于图像，使文本围绕在图像周围，不过在 CSS 中，任何元素都可以浮动。浮动元素会生成一个块级框，而不论它本身是何种元素。
4、属性值 float 是最开始出现的一种布局方式，主要解决：文本在图像周围环绕，也即应用于图像。但是在css中，任何元素都可以浮动， 浮动元素会生成一个块级框 ，而不论它本身是何种元素。
clear：both；这种方法有一个问题：margin失效。
方法1：test{clear：both；} test为浮动元素的下一个兄弟元素 方法2：test{display：block；zoom：1；overflow：hidden；} test为浮动元素的父元素。
这次给大家带来CSS有多少清除浮动的方式，清除浮动的注意事项有哪些，下面就是实战案例，一起来看一下。
建议：推荐使用，建议定义在公共类，以减少css代码 父级div定义overflow方法 当给父元素设置了overflow样式，不管是overflow：hidden或overflow：auto都可以清除浮动只要它的值不为visible就可以了。
css清除浮动float的三种方法总结：不清除浮动的话，浮动层后面的非浮动内容就有可能被浮动层所覆盖，造成版面错乱，所以必须清除浮动。
