css样式中浮动详解

浮动属性：float

1.浮动主要分为左浮动和右浮动分别为float: left; float: right。
每一次浮动后元素本身脱离文档流，原来的位置被其他元素所占据如果在同一个父元素中，目标元素回占据一个浮动后位置。

• 注意：但是浮动只能是子元素在容器中进行位置移动。如果父容器剩余宽度不能容纳两一个子元素，那么就换行。
• 目标元素的浮动范围：父容器
  2.当同一位置多个元素；具有浮动属性的元素；层级高于不惧有浮动属性的元素
  总结;浮动规律：第一步元素在布局流中的起始位置，第二步 ：沿自身水平方向进行浮动，如果水平方向空间不够，那么自动换到下一行。
  3.问题：如果父元素没有有高度那么会出现什么问题呢？？
  父元素没有设置固定高诶；那么 ，父元素高度由子元素撑起来。
  如果所有子元素都脱离了文档流；那么父元素久没有高度了
  只有不脱离文档流的元素才能撑起父元素的高度

解决浮动 带来的问题，

• 方式一：给父元素设置一个固定高度
• 方式二：在最后一个浮动元素，元素下面新加一个元素，清除浮动
• 方式三：伪元素清除；给父元素添加微元素 content:"",display:block ;clear:both;