金山老师的笔记float属性
left 元素向左浮动 right 元素向右浮动 none 默认值。元素不浮动，并会显示在其文本中出现的位置
浮动就是让元素可以向左或向右移动，直到它的外边距碰到其父级的内边距或者是上一个元素的外边距(这里指的上一个元素不管它有没有设置浮动，都会紧挨着上一个元素）
1.浮动元素支持所有的css样式
2.内容撑开宽高
3.多个元素设置浮动，宽度足够的话，会排在一行
4.脱离文档流
5.提升层级半级 也就是说：一个元素设置了浮动属性后，下一个元素就会无视这个元素的存在，但是下一个元素中的文本内容依然会为这个元素让出位置使自身的文本内容环绕在设置浮动元素的周围
注意：不管是行级还是块级元素，如果设置了浮动属性，该元素就变成了具有inline-block属性的元素
浮动的使用
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<style>
.class1 {
width: 200px;
height: 100px;
background: palegreen;
float: left;
}
.class2 {
width: 250px;
height: 130px;
background: gold;
float: left;
}
.class3 {
width: 300px;
height: 180px;
background: red;
float: left;
}
</style>
</head>
<body>
<div class="class1">我是块级元素1，没有设置浮动</div>
<div class="class2">我是块级元素2，没有设置浮动222222222222222222222222222222222222222</div>
<div class="class3">我是块级元素3，没有设置浮动</div>
</body>
</html>