CSS overflow为什么不生效?

css属性中的overflow如果要生效必须满足一个条件:子元素必须大于父元素

为什么html禁止了overflow子元素中添加了overflow但是并不生效。这是有可能由于父元素与子元素同为100%,父元素是与子元素一起变化不存在子元素overflow父元素的情况。

根据实验得到可以通过在父元素添加height属性,并设置为一个很小的值,或者设置overflow为hidden限制父元素的大小从而在子元素超过100%时产生overflow效果,但不能使用max-height来达到效果。

   

判定是否能够overflow的关键因素为子元素与父元素大小,在很多弹性布局中子元素与父元素一起变化导致了overflow没有效果,出现这种情况要从HTML开始清查必须要固定大小(百分比大小也可以)或者设置overflow为hidden,不能出现随着子元素弹性变化这样是无法出现overflow的。

FireFox调试工具中布局可以非常清楚的看到弹性布局尺寸信息,看到是否存在弹性增长。

   

posted @ 2019-07-05 09:56  JimmieLee  阅读(6744)  评论(0编辑  收藏  举报