首页 诗词 字典 板报 句子 名言 友答 励志 学校 网站地图
当前位置: 首页 > 教程频道 > 网站开发 > CSS >

CSS范例代码:万能float闭合(清除浮动)

2012-10-08 
CSS实例代码:万能float闭合(清除浮动)个人比较喜欢这种清除浮动的写法。因为不用再添加一个标签来写入样式

CSS实例代码:万能float闭合(清除浮动)
个人比较喜欢这种清除浮动的写法。因为不用再添加一个标签来写入样式直接写在大容器里面就可以了。但是有前提是里面的子元素要是浮动的。如果有的浮动有的不浮动建议还是在最后面添加标签来添加清楚样式。一、<div class="main clearfix"><div class="fl">左边</div><div class="fr">右边</div></div>二、<div class="main"><div class="fl">左边</div><div class="fr">右边</div><div class="clear"></div></div>????样式<style>.clearfix:after { content:"."; display:block; height:0; clear:both; visibility:hidden; }
*html?.clearfix{height:1%;}
*+html?.clearfix{height:1%}
.clearfix{display:inline-block}
.clearfix?{display:block;}.clear{clear:both;height:0px;overflow:Hidden;display:block;} /**添加浮动标签末尾**/?.main{width:400px;}.fl{float:left;width:200px;background:#ccc;}.fr{float:right;width:200px;background:#ddd;}</style>转自:http://www.ok22.org/art_detail.aspx?id=43

热点排行
Bad Request.