您的位置:首页 > 其它

网页弹窗居中显示

2015-05-20 13:47 204 查看
让网页中的一个弹窗居中显示

1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
2 <html xmlns="http://www.w3.org/1999/xhtml">
3 <head>
4 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
5 <title>始终在中间DIV (支持IE FF)</title>
6 <!doctype html>
7 <style type="text/css">
8 html,body {height:100%; margin:0px; font-size:12px;}
9 .mydiv {
background-color: #f9fff6;
border: 1px solid #009900;
text-align: center;
line-height: 50px;
font-size: 13px;
font-weight: bold;
z-index:99;
width: 300px;
height: 50px;
left:50%;/*FF IE7*/
top:50%;/*FF IE7*/

margin-left:-150px!important;/*FF IE7 half of its width */
margin-top:-60px!important;/*FF IE7 half of its height*/

margin-top:0px;
position:fixed!important;/*FF IE7*/
position:absolute;/*IE6*/

_top: expression(eval(document.compatMode &&
document.compatMode=='CSS1Compat') ?
documentElement.scrollTop + (document.documentElement.clientHeight-this.offsetHeight)/2 :/*IE6*/
document.body.scrollTop + (document.body.clientHeight - this.clientHeight)/2);/*IE5 IE5.5*/

}
</style>
<script language="javascript" type="text/javascript">
function showDiv(){
document.getElementById('popDiv').style.display='block';
}
window.onload=function(){
showDiv();
}
</script>
</head>

<body>
<div id="popDiv" class="mydiv" style="display:none;">始终在中间<br/>
</div>

</body>51 </html>
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: