如何使用javascript或css突出显示div,其余内容是灰色还是阴影？

Question

我看到div就像活动盒子一样,我认为必须有一种方法,而不是调整页面的颜色或创建一个图层,并使用z索引将聚焦的div带到前面.

我想隐藏页面上的所有内容,除了我要向用户显示的div.就像脸谱显示前面的图片,但你仍然可以看到背景中有50%不透明度的页面.

Answer 1

创建一个覆盖整个页面的元素:

<div id="modal"></div>

风格吧:

#modal {
    background: rgba(0,0,0,.8);
    position: fixed;
    top: 0; 
    left: 0;
    width: 100%; 
    height: 100%;
    z-index: 100;
}

只在需要时显示.接下来为我们想要的元素创建一个类:

.overModal {
    position: relative;
    z-index: 200;
}