Loading

[转载][HTML] 普通的DIV分层以及版透明效果

来源忘记哪的了，我稍微做了点修改，想了想还是挂了转载的标签，嗯嗯：

<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%; width: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%;width:100%;height:100%;background-color:black;z-index:1;-moz-opacity:0.8;opacity:.80;filter:alpha(opacity=80);">
        </div>
    </body>
</html>

 

 

posted @ 2013-07-01 16:23  魍魉_198x  阅读(3790)  评论(0)  编辑  收藏  举报