首页 > 代码库 > css中使用浮动的情况和清除浮动的方法
css中使用浮动的情况和清除浮动的方法
1.使用浮动时出现的情况:
(1)使块元素在一行显示
(2)使内嵌元素支持宽高
(3)不设置宽高的时候宽度由内容撑开
(4)换行不被解析(故使用行内元素的时候清除间隙的方法可以使用浮动)
(5)元素添加浮动,会脱离文档流,按照指定的一个方向移动,直到碰到父级的边框或者另外一个浮动元素停止(文档流是文档中可现实对象在排列时所占用的位置)
2.清除浮动的方法:
(1)给父级元素也加浮动(这种情况当父级元素margin:0 auto;也不能居中)
(2)给父级元素加display:inline-block;(同上一种方法不居中,只有IE6,7居中)
(3)在浮动元素下加<div class=”clear”></div> .clear{height:0px;font-size:0;clear:both;},但是在IE6下,块元素有最小高度,即当height<19px时,默认为19px,解决方法:font-size:0;或overflow:hidden;
(4)在浮动元素下加<br clear=”all”>
(5)给父级元素加{zoom:1}
.clear{zoom:1}
.clear:after{content:””;display:block;clear:both;}
(6)给浮动元素父级加overflow:auto;
eg:css的zoom属性:zoom属性是IE浏览器的专有属性,Firefox等浏览器不支持。它可以设置或检索对象的缩放比例。除此之外,它还有其他一些小作用,比如触发IE的hasLayout属性,清除浮动,清除margin的重叠等。
css中使用浮动的情况和清除浮动的方法
声明:以上内容来自用户投稿及互联网公开渠道收集整理发布,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任,若内容有误或涉及侵权可进行投诉: 投诉/举报 工作人员会在5个工作日内联系你,一经查实,本站将立刻删除涉嫌侵权内容。