来源忘记哪的了，我稍微做了点修改，想了想还是挂了转载的标签，嗯嗯：
<html> <head> <title>EXAMPLE</title> </head> <body> <p>可以根据自己要求修改css样式<a href = "javascript:void(0)" onclick = "document.getElementById('light').style.display='block';document.getElementById('fade').style.display='block'">点击这里打开窗口</a></p> <div id="light" style="display:none;position:absolute;top: 25%;left:25%; 50%;height:50%;padding:16px;border:16px solid orange;background-color:white;z-index:2;overflow:auto;"> This is the lightbox content. <a href = "javascript:void(0)" onclick = "document.getElementById('light').style.display='none';document.getElementById('fade').style.display='none'">Close</a> </div> <div id="fade" style="display:none;position:absolute;top:0%;left:0%;100%;height:100%;background-color:black;z-index:1;-moz-opacity:0.8;opacity:.80;filter:alpha(opacity=80);"> </div> </body> </html>