visibility:hidden应用于html元素时样式的作用是什么?是否与滚动条有关,尤其是 关于IE7?
背景:Oracle Apex生成此代码,我试图解决它是否导致IE7中间歇性隐藏的水平滚动条出现问题:
<style> html {visibility:hidden;} </style>
Run Code Online (Sandbox Code Playgroud)
根据规范,该visibility物业仍应影响布局.这意味着如果元素最终导致滚动行为,它不应该影响滚动.此外,设置的任何子项visible都应在hidden元素中可见.
用这个小提琴 ......
Firefox,IE 8-10,Opera
使得visibility: hidden在对html元素不会使body(因为它应该),但仍显示一些渲染html本身,因为它显示了background-color.正如BoltClock在他的评论中指出的那样,这实际上可能是预期的,因为background它html是(根据规范)成为......
"画布的背景及其背景绘画区域扩展到覆盖整个画布."
这些浏览器还允许设置回visible内部的元素显示为visibility指示的规范,因此div显示并可以滚动.
Chrome和Safari
它不渲染background-color的html,但它允许的div显示,它显示滚动条.因此Chrome不会将该background属性传播到画布,大概是因为它visibility被设置为hidden.
IE7
在background-color为html元素不会呈现(如Chrome),但也有显示出来没有滚动条的div内部元素.这似乎表明它没有按照规范正确地停留在布局中.
所以可能是该visibility: hidden属性是您的问题的一部分.显然,背景点根本不涉及滚动问题,但确实解决了关于属性如何影响html元素的整体问题.
在我看来,Chrome和Safari渲染似乎是最直观的(我可能期望作为设计师),因为我不希望background-color渲染(因为元素是hidden),但同时,如果我设置一个孩子visible,然后我希望浏览器让我代表那个孩子滚动,即使html包装设置为visibility: hidden.然而,在WebKit浏览器或其他浏览器是否是最接近规范是值得商榷的,如BoltClock在他的评论noteed,规范似乎并没有表明是否visibility将上html元素应该或不应该影响的传播background属性).