overflow:hidden
-
作用一:隐藏溢出
熟知的作用就是给父元素设置后,子元素若从父元素中溢出,溢出部分不会显示 -
作用二:清除浮动
子元素浮动时,给父元素设置overflow:hidden,父元素尝试隐藏子元素超出父元素的部分,但是因为子元素浮动了,父元素找子元素的下边界时犯迷糊,所以父元素自动增大以包住子元素,从而达到子元素好像没有浮动一样的效果。
推广,对于兄弟元素,前一个兄弟开启浮动,后一个元素设置overflow:hidden,后一个元素清除了前一个元素浮动的效果,便排到前一个元素的右边去了。
总结:overflow设置为非visible的值时,开启了元素的bfc,拥有不被浮动元素覆盖的特点。