css 浮动样式无效,CSS样式的浮动的解决方法

css样式浮动的解决方法

1.增加一个空样式的div

.clearfix{

clear: both;

}

div1

div2

div3

2.设置外部div的overflow属性为auto或者hidden

.box{

background-color: yellow;

overflow:atuo; //或者是hidden

}

.box1{

width: 100px;

height: 100px;

background-color: green;

}

.box2{

width: 100px;

height: 100px;

background-color: red;

}

div1

div2

3.利用伪类元素来清除有浮动

.clearfix:after{

content:"";

display:table;

height:0;

visibility:both;

clear:both;

}

.clearfix{

*zoom:1; /* IE/7/6*/

}

div1

div2

标签：浮动,样式,100px,height,color,div1,background,div2,CSS

来源： https://www.cnblogs.com/lijie0609/p/11759175.html