为了账号安全,请及时绑定邮箱和手机立即绑定

老师讲的很好,如果光看W3C的手册的话,很多属性都不知道是做什么用的。比如之前的overflow:hidden;和z-index。但是通过老师的讲解,明白了。

正在回答

1 回答

overflow:hidden本意上是和float清理无关的,但是它有这个效果,所以拿来使用。

它字面的含义是:隐藏溢出的。

比如,当父元素设置了,width:50px;height:50px;

子元素设置了,width:100px;height:100px;

这个时候,子元素有部分超出了父元素的边界,相当于是溢出。

此时,给父元素设置overflow:hidden,子元素溢出的部分就被隐藏了,大小变的就等于父元素(其实没有,只是看起来是变小)。

如果父元素没有设置尺寸,子元素设置了浮动float,那么父元素由于内部没有其他的子元素,尺寸会自动压缩成0。与父元素同级别的兄弟元素会处于子元素的下方,被它遮盖。

这个时候,给父元素设置overflow:hidden,父元素就会被撑开,包围住子元素,父元素同级别的的兄弟自然不会被子元素遮盖了,以此,实现了清理。

所以,如果父元素设置了尺寸,最好不要用来清理其他元素,因为会切割子元素的溢出部分。但是一般情况,父元素不会设置固定尺寸大小吧。

1 回复 有任何疑惑可以回复我~

举报

0/150
提交
取消
网页布局基础
  • 参与学习       214705    人
  • 解答问题       1756    个

让你精通CSS中三大定位机制,彻底掌握网页布局的相关知识

进入课程
意见反馈 帮助中心 APP下载
官方微信