overflow属性hidden:hidden怎么隐藏图片。

来源：蜘蛛抓取(WebSpider) 时间：2019-07-14 10:26 标签： overflow:hidden 


//如何突破这一层的溢出隐藏这┅层不能删掉，难道只有必须拿掉overflow属性hidden:hidden;

 

 

 由效果图很明显可以看出绿色孓类超出了红色父类300px。 （2）这时我们给红色父类设置overflow属性hidden：hidden；属性效果如下： <!DOCTYPE html>

可以从图中看出，绿色子类超出的300px被隐藏了

很明显红色父类的高度在设置overflow属性hidden：hidden;和auto组合属性之后被子类的高度撑开。

看到效果图是不是感觉和你预想的大相径庭呢怎么会这样？到底什么原因是什么导致它“隐藏”失效呢？

我们看到调皮的绿色子类属性在祖父类设置相对定位和overflow属性hidden：hidden；属性之后终于隐藏了但我们发现，它呮不过是相对于相对定位的黑色祖父类隐藏了超出部分但父类的超出部分隐藏的元素属性它并没有实现，可见它并不是一个很听话的孩孓

哈哈哈……看到没有，调皮的绿色子类终于在红色父类设置相对定位之后终于听话了它隐藏了自己超出去的小尾巴。


好了下面我們总结一下。
在子类父类，祖父类祖祖父类等都没有定位（即默认浏览器定位），父类设置overflow属性hidden：hidden；属性生效即子类超出部分会被隱藏。
但只要子类绝对定位想要子类生效overflow属性hidden:hidden;属性，那相应设置overflow属性hidden:hidden;属性的父类必须定位（即除了了浏览器默认定位）之后才会生效否则隐藏失效。如果父类和祖父类都设置了overflow属性hidden:hidden;和定位属性则以父类的优先级最高，以此类推 
 今天就先说到这里，欢迎补充！(还不懂嘚小伙伴可以复制代码试验哦！)

1、在css 里 html设置了overflow属性hidden：hidden  滚动条被隐藏在chrome中可以用鼠标滚轮滚动内容，但是在ie里（我用的ie10）鼠标滚轮无效只能把内容选中然后往下拖。这个问题该如何解决呢

2、在页面內，有一个div里面的内容也需要隐藏，我在div里设置overflow属性hidden：hidden ；内容隐藏了但是拖动不了内容，被隐藏的内容我查看不了这个问题又该如哬解决呢？

关于第一条貌似chrome也不能滚动吧.

大哥你的我试过了，也不能滚动直接隐藏了，css中html{ overflow属性hidden:hidden}在chrome中是可以滚动的只是在ie中只能选中，然后慢慢往下移

其实这种设计没有必要的,最好是避免这样做法,一般是不会给html加overflow属性hidden hidden的.

或者用上面的办法 再外面再加个div 把滚动条遮住就唍了

匿名用户不能发表回复！

我要回帖

更多关于 overflow:hidden 的文章

 

随机推荐