怎样使层相对于屏幕居中显示？

<HTML>
<HEAD>
<META http-equiv=Content-Type content="text/html; charset=gb2312">
<TITLE>登录</TITLE>
<link rel="stylesheet" href="default.css" />
<STYLE type=text/css>
BODY,TD,INPUT{font-size:9pt}
  .window { BORDER-RIGHT: #606060 2px solid; PADDING-RIGHT: 2px; BORDER-TOP: #f0f0f0 2px solid; PADDING-LEFT: 2px; VISIBILITY: ; PADDING-BOTTOM: 2px; MARGIN: 0px; BORDER-LEFT: #d0d0d0 2px solid; PADDING-TOP: 2px; BORDER-BOTTOM: #404040 2px solid; POSITION: absolute; BACKGROUND-COLOR: #184BA5; TEXT-ALIGN: left;  }
  .titleBar {PADDING-RIGHT: 2px; PADDING-LEFT: 2px; FONT-WEIGHT: bold; FONT-SIZE: 9pt; PADDING-BOTTOM: 2px; MARGIN: 0px; WIDTH: auto; CURSOR: default; COLOR: #ffffff; PADDING-TOP: 2px; FONT-FAMILY: 宋体; WHITE-SPACE: nowrap;}
  .titleBarText { PADDING-LEFT: 6px; OVERFLOW: hidden; TEXT-ALIGN: left;}
  .clientArea {PADDING:10px; FONT-FAMILY: 宋体; BACKGROUND-COLOR: #ECF0E1}
</STYLE>
</HEAD>
<BODY onselectstart="return false">
<DIV class=window id="logon" style="LEFT:expression(Math.abs(Math.round((window.document.body.clientWidth - logon.offsetWidth)/2))); WIDTH: 360px; TOP:expression(Math.abs(Math.round((window.document.body.clientHeight - logon.offsetHeight)/2)))" style="filter:progid:DXImageTransform.Microsoft.Gradient(GradientType=1, StartColorStr='#FF003399', EndColorStr='#FF6699CC');">
  <DIV class=titleBar><img src="http://lucky.myrice.com/images/copyright.gif" width="16" height="16" align="absmiddle"><SPAN class=titleBarText>请先登录</SPAN></DIV>
    <DIV class=clientArea style="">
    <img src="http://lucky.myrice.com/images/security.gif" align="absmiddle">&nbsp;&nbsp;请输入您授权管理的用户名和密码。
    <br><br>
    <table align="center" width="300" border="0" cellpadding="0" cellspacing="6">
    <form action="http://lucky.myrice.com" method="post" name="LogonForm">
    <tr>
      <td align="center">服务器：</td>
      <td><a href="http://lucky.myrice.com" style="color:#000000;text-decoration:none">http://lucky.myrice.com</a></td>
    </tr>
    <tr>
      <td align="center">用户名：</td>
      <td><input type="text" name="UserName" value="" style="border:1px solid gray"></td>
    </tr>
    <tr>
      <td align="center">密&nbsp;&nbsp;码：</td>
      <td><input type="password" name="Password" style="border:1px solid gray"></td>
    </tr>
    <tr>
      <td colspan="2" align="center">
        <input type="submit" value=" 登  录 " name="logon" class="CustButton" style="padding-top:2px">
        <input type="hidden" name="href" value="">
      </td>
    </tr>
    </form>
    </table>
  </DIV>
</DIV>
</BODY>
</HTML>

解决方案 »

  1.   

    <DIV ID="oDiv" STYLE="background-color: #0099FF; position: absolute; top:expression(document.body.clientHeight/2 - oDiv.offsetHeight/2); left: expression(document.body.clientWidth/2 - oDiv.offsetWidth/2);">
    <img src="http://www.csdn.net/images/csdn.gif">
    </DIV>
    http://lucky.myrice.com/logon.htm
      

  2.   

    <SCRIPT>
    window.onload=fnInit;function fnInit(){
       oDiv.style.setExpression("left",
          "document.body.clientWidth/2 - oDiv.offsetWidth/2"
       );   oDiv.style.setExpression("top",
          "document.body.clientHeight/2 - oDiv.offsetHeight/2"
       );
    }</SCRIPT>
    <DIV ID="oDiv"  STYLE="background-color: #CFCFCF; position: absolute; top: 0; left: 0;">
    <img src="http://www.csdn.net/images/csdn.gif">
    </DIV>
      

  3.   

    <body onload="change()">
    <div id=a1 style="width:200;height:100;background:red;position:absolute;">
    </div>
    <script language=javascript>
    a1.style.left=(parseInt(screen.width)-parseInt(a1.style.width))/2-window.screenLeft;
    a1.style.top=(parseInt(screen.height)-parseInt(a1.style.height))/2-window.screenTop;
    </script>