1 <html xmlns="http://www.w3.org/1999/xhtml">
2 <head>
3 <meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
4 <title>web设计大本营</title>
5 <style type="text/css">
6 <!--
7 html,body {height:100%; margin:0px; font-size:12px;}
8
9 .mydiv {
10 background-color: #FFCC66;
11 border: 1px solid #f00;
12 text-align: center;
13 line-height: 40px;
14 font-size: 12px;
15 font-weight: bold;
16 z-index:99;
17 width: 300px;
18 height: 120px;
19 left:50%;/*FF IE7*/
20 top:50%;/*FF IE7*/
21
22 margin-left:-150px!important;/*FF IE7 该值为本身宽的一半 */
23 margin-top:-60px!important;/*FF IE7 该值为本身高的一半*/
24
25 margin-top:0px;
26
27 position:fixed!important;/*FF IE7*/
28 position:absolute;/*IE6*/
29
30 _top: expression(eval(document.compatMode &&
31 document.compatMode=='CSS1Compat') ?
32 documentElement.scrollTop + (document.documentElement.clientHeight-this.offsetHeight)/2 :/*IE6*/
33 document.body.scrollTop + (document.body.clientHeight - this.clientHeight)/2);/*IE5 IE5.5*/
34
35 }
36 .bg {
37 background-color: #666;
38 width: 100%;
39 height: 100%;
40 left:0;
41 top:0;/*FF IE7*/
42 filter:alpha(opacity=50);/*IE*/ /*点击后背景透明效果*/
43 opacity:0.5;/*FF*/
44 z-index:1;
45
46 position:fixed!important;/*FF IE7，this line code is extremely important*/
47 position:absolute;/*IE6*/
48
49 _top: expression(eval(document.compatMode &&
50 document.compatMode=='CSS1Compat') ?
51 documentElement.scrollTop + (document.documentElement.clientHeight-this.offsetHeight)/2 :/*IE6*/
52 document.body.scrollTop + (document.body.clientHeight - this.clientHeight)/2);/*IE5 IE5.5*/
53
54 }
55 -->
56 </style>
57 <script language="javascript" type="text/javascript">
58 function showDiv(){
59 document.getElementById('popDiv').style.display='block';
60 document.getElementById('bg').style.display='block';
61 }
62
63 function closeDiv(){
64 document.getElementById('popDiv').style.display='none';
65 document.getElementById('bg').style.display='none';
66 }
67
68 </script>
69 </head>
70 <body>
71
72 <div id="popDiv" class="mydiv" style="display:none;">网页设计大本营欢迎你！<br/>Q群号:26868887<br/>
73 <a href="javascript:closeDiv()">关闭窗口</a>
74 </div>
75
76 <div id="bg" class="bg" style="display:none;">5555555555</div>
77 <div>
78 <pre> 春江花月夜
79 唐 张若虚
80
81 春江潮水连海平，海上明月共潮生。
82
83 滟滟随波千万里，何处春江无月明？
84 </pre>
85 <p><br />
86
87
88 </p>
89 <div style="height:200px; line-height:200px; text-align:center; background:#FFFFCC;"><a href="javascript:showDiv()">点我,弹出层</a></div>
90
91 </body>
92 </html>
