让网页中的一个弹窗居中显示
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 {
10 background-color: #f9fff6;
11 border: 1px solid #009900;
12 text-align: center;
13 line-height: 50px;
14 font-size: 13px;
15 font-weight: bold;
16 z-index:99;
17 width: 300px;
18 height: 50px;
19 left:50%;/*FF IE7*/
20 top:50%;/*FF IE7*/
21
22 margin-left:-150px!important;/*FF IE7 half of its width */
23 margin-top:-60px!important;/*FF IE7 half of its height*/
24
25 margin-top:0px;
26 position:fixed!important;/*FF IE7*/
27 position:absolute;/*IE6*/
28
29 _top: expression(eval(document.compatMode &&
30 document.compatMode=='CSS1Compat') ?
31 documentElement.scrollTop + (document.documentElement.clientHeight-this.offsetHeight)/2 :/*IE6*/
32 document.body.scrollTop + (document.body.clientHeight - this.clientHeight)/2);/*IE5 IE5.5*/
33
34 }
35 </style>
36 <script language="javascript" type="text/javascript">
37 function showDiv(){
38 document.getElementById('popDiv').style.display='block';
39 }
40 window.onload=function(){
41 showDiv();
42 }
43 </script>
44 </head>
45
46 <body>
47 <div id="popDiv" class="mydiv" style="display:none;">始终在中间<br/>
48 </div>
49
50 </body>
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 {
10 background-color: #f9fff6;
11 border: 1px solid #009900;
12 text-align: center;
13 line-height: 50px;
14 font-size: 13px;
15 font-weight: bold;
16 z-index:99;
17 width: 300px;
18 height: 50px;
19 left:50%;/*FF IE7*/
20 top:50%;/*FF IE7*/
21
22 margin-left:-150px!important;/*FF IE7 half of its width */
23 margin-top:-60px!important;/*FF IE7 half of its height*/
24
25 margin-top:0px;
26 position:fixed!important;/*FF IE7*/
27 position:absolute;/*IE6*/
28
29 _top: expression(eval(document.compatMode &&
30 document.compatMode=='CSS1Compat') ?
31 documentElement.scrollTop + (document.documentElement.clientHeight-this.offsetHeight)/2 :/*IE6*/
32 document.body.scrollTop + (document.body.clientHeight - this.clientHeight)/2);/*IE5 IE5.5*/
33
34 }
35 </style>
36 <script language="javascript" type="text/javascript">
37 function showDiv(){
38 document.getElementById('popDiv').style.display='block';
39 }
40 window.onload=function(){
41 showDiv();
42 }
43 </script>
44 </head>
45
46 <body>
47 <div id="popDiv" class="mydiv" style="display:none;">始终在中间<br/>
48 </div>
49
50 </body>
51 </html>