定义

float指定一个元素应沿其容器的左侧或右侧放置，允许文本和内联元素环绕它。

一个浮动元素是float的值不为none的元素。

float的值

• left

  表示元素浮动在所在块容器的左侧

• right

  表示元素浮动在所在块容器的右侧

• none

  不进行浮动

• inline-start

• inline-end

浮动元素的定位

当一个元素浮动之后，它会被移出正常的文档流，然后向左或者向右平移，一直平移直到碰到了所处的容器的边框，或者碰到另外一个浮动的元素。

使用

在每个元素标签中添加

style="float: left(right);"

或

p {
  float: left;
}

清除浮动

在这些元素的父元素中添加

class="clearfix"

clearfix的代码

.clearfix::after{
	content: '';
	display: block;
	clear: both;
}

clear属性

使得一些元素的左右两侧不会有浮动元素

.p1 {
	clear: left;
}
.p2 {
  clear: right;
}
.p3 {
  clear: both;
}

clear属性只对元素本身的布局起作用