首页
Web开发
Windows程序
编程语言
数据库
移动开发
系统相关
微信
其他好文
会员
首页
>
Web开发
> 详细
网页弹窗居中显示
时间:
2015-05-20 14:36:41
阅读:
118
评论:
0
收藏:
0
[点我收藏+]
标签:
让网页中的一个弹窗居中显示
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
>
51
</
html
>
网页弹窗居中显示
标签:
原文地址:http://www.cnblogs.com/White-Quality/p/4516984.html
踩
(
0
)
赞
(
0
)
举报
评论
一句话评论(
0
)
登录后才能评论!
分享档案
更多>
2021年07月29日 (22)
2021年07月28日 (40)
2021年07月27日 (32)
2021年07月26日 (79)
2021年07月23日 (29)
2021年07月22日 (30)
2021年07月21日 (42)
2021年07月20日 (16)
2021年07月19日 (90)
2021年07月16日 (35)
周排行
更多
36.VUE — 认识 Webpack 和 安装
2021-07-28
【PHP】上传图片翻转问题
2021-07-28
php对数字进行万。亿的转化
2021-07-28
五个 .NET 性能小贴士
2021-07-28
Three.js中显示坐标轴、平面、球体、四方体
2021-07-28
.net 5+ 知新:【1】 .Net 5 基本概念和开发环境搭建
2021-07-27
1.html,css
2021-07-27
基于Docker搭建 Php-fpm + Nginx 环境
2021-07-27
nginx + http + svn
2021-07-27
kubernets kube-proxy的代理 iptables和ipvs
2021-07-26
友情链接
兰亭集智
国之画
百度统计
站长统计
阿里云
chrome插件
新版天听网
关于我们
-
联系我们
-
留言反馈
© 2014
mamicode.com
版权所有 联系我们:gaon5@hotmail.com
迷上了代码!