CSS 浮动布局
float : left | right
特点 :
1.元素浮动之后不占据原来的位置(脱标)
2.浮动的盒子在一行上显示
3.行内元素浮动之后转换为行内块元素(不推荐使用,转行内元素还是用display:inline-block)
作用 :
1.文本绕图
2.制作导航
3.网页布局
//清除浮动
当父盒子没有定义高度,嵌套的盒子浮动后,下边的元素发生未知错误
1.清除浮动不是不用浮动,清除浮动产生的不利影响.
2.清除浮动的方法
clear : left | right | both(最常用)
在最后一个浮动元素后添加标签.
overflow : hidden //这种有弊端 出了盒子就不能用这个了
伪元素清除浮动
.clearfix:after{
content:".";
display:block;
height:0;
line-height:0;
visibility:hidden;
clear:both;
}
//兼容ie浏览器
.clearfix{
zoom : 1 ;
}