1 .如果将overflow3360hidden溢出隐藏元素设置为overflow3360hidden，则当元素的内容超过指定的宽度和高度属性时，超出的部分将隐藏，不带占位符。
/*css样式*/styletype=' text/CSS ' div { width :150 px； height: 60px； 背景：天空蓝； Overflow :隐藏； /*溢出隐藏*/}/style/*html*/div style=' '今天天气很好！ br今天天气很好！ br今天天气很好！ br今天天气很好！ br/div效果如下。
通常，页面在正常溢出后显示省略号。 例如，如果一行文本超过固定宽度，溢出内容将隐藏并显示省略号。
/*单行文本*/div{ width: 150px； 背景：天空蓝； Overflow :隐藏； /*溢出隐藏*/white-space: nowrap； /*规定文本不换行*/text-overflow: ellipsis； /*对象中的文本溢出时显示省略号(…) )/)的效果如下：
二. overflow:hidden 清除浮动一般而言，如果不对父元素设置高度，则高度会根据内容自适应地增加。 如果父元素中的所有子元素都设置为浮动浮动，则子元素将脱离标准流(不带占位符)，父元素将无法检测子元素的高度，父元素的高度为0。 问题如下
/*css样式*/styletype=' text/CSS '.box { background 3360 sky blue； } .kid{ width: 100px； height: 100px； 浮点：左； } .kid1{ background: yellow； } .kid2{ background: orange； } .wrap{ width: 300px； height: 150px； 后台： blue； color:白色； }/style/* html */bodydivclass=' box ' divclass=' kidkid1'子元素1/divdiv class='kid kid2'子元素2/div/divdivclass=
如上所述，由于父元素没有高度，所以下面的元素会被向上推动以聚合页面。 因此，必须将overflow:hidden属性添加到父级，以便父级的高度适应子级容器和子级内容的高度。 如下所示。
在IE较低版本的浏览器中打开溢出：隐藏； 无法获得这种效果，因此需要添加wldxh:1；
因此，为了提高兼容性，如果需要使用overflow :隐藏来清除浮动，建议添加wldxh:1
/*css样式*/styletype=' text/CSS '.box { background 3360 sky blue； Overflow :隐藏； */wldxh:1通关； } .kid{ width: 100px； height: 100px； 浮点：左； } .kid1{ background: yellow； } .kid2{ background: orange； } .wrap{ width: 300px； height: 150px； 后台： blue； color:白色； }/style/* html */bodydivclass=' box ' divclass=' kidkid1'子元素1/divdiv class='kid kid2'子元素2/div/divdivclass=
三. overflow:hidden 解决外边距塌陷父元素内部有子元素。 将边距顶部样式添加到子元素时，父元素也会一起下降，从而破坏外部边距，如下所示：
/*css样式*/styletype=' text/CSS '.box { background 3360 sky blue； } .kid{ width: 100px； height: 100px； 后台： yellow； margin-top :20 px }/style/* html */bodydivclass=' box ' divclass=' kid '子元素1/div /div/body
因此，向父元素中添加overflow :隐藏可以解决此问题。
/*css样式*/styletype=' text/CSS '.box { background 3360 sky blue； Overflow :隐藏； /*解决外距塌陷*/} .kid{ width: 100px； height: 100px； 后台： yellow； margin-top :20 px }/style/* html */bodydivclass=' box ' divclass=' kid '子元素1/div /div/body