CSS之解决高度塌陷问题方法终极版

来源:互联网 发布:网络视频协议 编辑:程序博客网 时间:2024/06/05 00:44
<!DOCTYPE html><html><head><meta charset="UTF-8"><title></title><style type="text/css">.box1{border: 1px solid red;}.box2{width: 100px;height: 100px;background-color: blue;float: left;}/* * 通过after伪类添加一个空白的块元素,然后对其清除浮动 * 而且不会在结构中添加div */.clearfix:after{/*添加一个内容*/content: "";/*转换一个块元素*/display: block;/*清除两侧浮动*/clear: both;}/* * 在IE6中不支持after伪类,还需hasLayout解决问题 */.clearfix{zoom : 1;}</style></head><body><div class="box1 clearfix"><div class="box2"></div></div></body></html>