这是我的页面网址
在此页面中,如果我们单击“登录”按钮,它将显示一个黑色背景的弹出屏幕。但是如果我们缩小页面,那么它会减小背景颜色的大小。但是如果我们缩小,我想覆盖整个屏幕的背景。我在我的页面中使用了下面的代码。
.black_overlay{
display: none;
position: absolute;
top: 0%;
left: 0%;
width: 100%;
height: 2000%;
background-color: black;
z-index:1001;
-moz-opacity: 0.8;
opacity:.80;
filter: alpha(opacity=80);
}
但在测试页面中,下面的代码用于覆盖整个背景。它工作正常。
<style type="text/css">
/*give the body height:100% so that its child
elements can have percentage heights*/
body{ height:100% }
/*this is what we want the div to look like*/
div.fullscreen{
display:block;
/*set the div in the top-left corner of the screen*/
position:absolute;
top:0;
left:0;
background-color: black;
/*set the width and height to 100% of the screen*/
width:100%;
height:100%;
color: white;
}
</style>
<div class="fullscreen">
<p>Here is my div content!!</p>
</div>
我不知道如何为我的登录页面背景做同样的事情。任何人都可以帮我解决这个问题。
最佳答案
尝试
div.fullscreen{
position:fixed
...
}
absolute:元素相对于其第一个定位的(非静态的)祖先元素定位
固定:元素相对于浏览器窗口定位
关于javascript - 灯箱背景颜色应使用 CSS 覆盖整个屏幕,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/13760803/