浮动介绍
浮动是为了让文字环绕图片排布
float属性
在css中可以通过float属性实现元素浮动，float属性定义元素在哪个方向浮动，它有两个值float:left 和 float:right，默认值为none
设置这两个值元素的水平方向浮动，意味着元素只能左右移动而不能上下移动。
浮动使元素脱离文档流，按照指定方向发生移动，遇到父级边界或者相邻浮动元素会停下来
浮动元素之后的元素将围绕它，之前的元素将不会受到影响
特点
不区分行、块、行内块元素，使用浮动直接让元素变为块级
支持宽高、margin、padding，但不支持margin：auto
不会有空隙问题
例子
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<style type="text/css">
*{
margin: 0;
padding: 0;
}
.container{
width: 300px;
height: 300px;
background-color: #23A6D5;
}
img{
width: 100px;
float: left;
}
</style>
</head>
<body>
<div class="container">
<img src="a.jpg">
<p>aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa</p>
</div>
</body>
</html>