每
W3 CSS2 spec,
For HTML documents, however, we recommend that authors specify the
background for the BODY element rather than the HTML element. User
agents should observe the following precedence rules to fill in the
background: if the value of the ‘background’ property for the HTML
element is different from ‘transparent’ then use it, else use the
value of the ‘background’ property for the BODY element. If the
resulting value is ‘transparent’, the rendering is undefined.
根据这个,如果你在主体上设置背景颜色或背景图像,但是没有在html上设置透明而不是透明,那么html将使用主体的背景.所以当你隐藏身体时,html仍将使用它的背景.
DEMO
var hideButton = $('#hide-body');
var toggleBGButton = $('#toggle-html-bg');
hideButton.on('click', function() {$('body').hide()} );
toggleBGButton.on('click', function() {$('html').toggleClass('bg')} );
html {
background-color: transparent;
}
html.bg {
background-color: orange;
}
body {
background-image: url("https://www.google.com/images/branding/googlelogo/2x/googlelogo_color_272x92dp.png");
background-color: blue;
}
body.hide {
display: none;
}
Hide body
Toggle <html> background-color
扫一扫
814
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
