首页 > Web开发 > 详细

css浮动中避免包含元素高度为0的4种解决方法

时间:2014-04-14 09:44:00      阅读:527      评论:0      收藏:0      [点我收藏+]

问题:当子元素中使用了float时,如果其父元素不指定高度,其高度将为0

解决:清除(闭合)浮动元素,使其父div高度自适应

 

方法一:额外标签+clear:both     W3C推荐方法,兼容性较好)

       在父div的最后插入一个无语义的额外标签,使其styleclear:both

如:<div style=”clear:both;”></div>

或:<br style=”clear:both;”/>

 

方法二:使用after伪类             (兼容性一般)

       使用伪类在父div的末尾添加新的内容(如一个点),来清除浮动。

如:#div:after{conten:”.”;height=0;visibility:hidden;display:block;clear:both;}

 

方法三:overflow:hidden|auto      (可能会有负面影响,使用时多测试)

       设置父divoverflowhiddenauto

 

方法四:浮动父div                    IE/win、标准浏览器中较好,不推荐)

       让父div也浮动,因为浮动元素会闭合浮动元素。

css浮动中避免包含元素高度为0的4种解决方法,布布扣,bubuko.com

css浮动中避免包含元素高度为0的4种解决方法

原文:http://www.cnblogs.com/losesea/p/3662945.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!