css - 覆盖 div 甚至到窗口的滚动条

Question

这demo不覆盖滚动条。

这甚至可以覆盖 <div>也到滚动条？今天之前，我认为这是不可能的，但只是因为我的网站知道它的解决方法。请检查我的答案。

Answer 1

html:

<div id="content">
</div>
<div id="all">
<div id="overlay"></div> 
</div>

CSS:

*{
    margin: 0;
    padding: 0;
}
html,body{
    height: 100%;
    width: 100%;
    overflow: auto;
}
#all{
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    border: 1px solid red;
}
#content{
    height: 200%;
}
#overlay {
    background: #000;
    margin-top: 18px;
    height: 50px;
}

将 overflow auto 设置为 html,body 效果惊人。 demo

如果您设置overflow:visible;，那么您会看到它不会覆盖到滚动条上。