时间:2021-05-08
如果父元素只包含浮动元素,且父元素未设置高度和宽度的时候。那么它的高度就会塌缩为零,也就是所谓的“高度塌陷”,如果父级元素包含背景或者边框,那么溢出的元素就不像父级元素的一部分了。解决“高度塌陷”的问题很简单:
1.浮动父级元素
如果让父级元素浮动,父级元素的高度就会扩大,直到完全包含它里面的浮动元素,虽然这个方法很奇怪,但是很有效。如果选择这种方法,一定要在该元素的下个元素添加clear:both,确保浮动元素落到父级元素的下方。
2.利用overflow:hidden,zoom:1
复制代码代码如下:
{
overflow:hidden;
zoom:1;
}
overflow:hidden属性也是css中比较奇怪的特性,它会强制父级元素扩大到包含浮动元素,zoom:1只是触发ie6的hasLayout模式,不会对其他浏览器产生影响。
3.使用“简单清除法”
复制代码代码如下:
.clearfix{
zoom:1;
}
.clearfix:after{
content:'';
display:block;
height:0;
font-size:0;
clear:both;
overflow:hidden;
}
其中zoom:1还是只兼容ie6,:after是css中的伪类,ie6以及以下版本都不兼容。此方法可以说是综合起来最好的方法了,不会影响任何其他样式,通用性强,覆盖面广。
声明:本页内容来源网络,仅供用户参考;我单位不保证亦不表示资料全面及准确无误,也不保证亦不表示这些资料为最新信息,如因任何原因,本网内容或者用户因倚赖本网内容造成任何损失或损害,我单位将不会负任何法律责任。如涉及版权问题,请提交至online#300.cn邮箱联系删除。
宽度是高度的两倍(等比缩放)实现思路:以父级元素为基准,子级width:100%;(也就是父级宽度的100%),padding-top:50%(也就是父级宽度的
让页面呈现多列布局时经常会使用float:left/right,可是浮动布局会导致父元素的高度为0(未设置高度的情况下),不会根据子元素的高度而变化,另外,后面
获取或设置div的高度和宽度方法一:height和width函数(得到的是证书),可以用于获取或设置元素的高度和宽度。val()获取或设置元素的值方法二:css
浮动元素使其父元素高度塌陷我们经常会遇到一种情况,给一个元素设置浮动之后float:left/right;,如果该元素的父元素有背景颜色,那么会发现父元素的背景
tabs代码如下:复制代码代码如下: tabs1 tabs2 如果id="tabs"的div未设置宽度和高度,easyUI默认的宽度和高度是aut