点击按钮跳出隐藏的div层，并设背景。

style：    

        

.black_overlay{

            display: none;

            position: absolute;

            top: 0%;

            left: 0%;

            width: 100%;

            height: 100%;

            background-color: #696969;

            z-index:1001;

            -moz-opacity: 0.8;

            opacity:.80;

            filter: alpha(opacity=88);

        }

        .white_content {

            display: none;

            position: absolute;

            top: 25%;

            left: 25%;

            width: 55%;

            height: 55%;

            padding: 20px;

            border: 10px solid #ddd;

            background-color: white;

            z-index:1002;

            overflow: auto;

        }

       html：

1 <p>示例弹出层：<BUTTON onclick = "document.getElementById('light').style.display='block';document.getElementById('fade').style.display='block'">请点这里</BUTTON></p>
2  <div id="light" class="white_content"> 这是一个层窗口示例程序. 
3         <BUTTON onclick = "document.getElementById('light').style.display='none';document.getElementById('fade').style.display='none'">点这里关闭本窗口</BUTTON>       
4 </div>
5  <div id="fade" class="black_overlay"></div>    

 

       

转载于:https://www.cnblogs.com/kamo-qie/p/5223152.html