<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="zh" lang="zh">
<head profile="http://www.w3.org/2000/08/w3c-synd/#">
<meta http-equiv="content-language" content="zh-cn" />
<meta http-equiv="content-type" content="text/html;charset=gb2312" />
<title>blueidea</title>
<style type="text/css">
/*<![CDATA[*/
div {
position:absolute;
top:50%;
left:50%;
margin:-100px 0 0 -100px;
width:200px;
height:200px;
border:1px solid red;
}
/*]]>*/
</style>
</head>
<body>
<div>web标准常见问题大全</div>
</body>
</html>
--------------------------------------
margin:-100px 0 0 -100px;
分别指的是 元素本身高的二分之一 和宽的二分之一, 当为负数的时候 也即是从TOP,LEFT 中的50% 减去了 自身高的二分之一了 这就符合水平垂直居中
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="zh" lang="zh">
<head profile="http://www.w3.org/2000/08/w3c-synd/#">
<meta http-equiv="content-language" content="zh-cn" />
<meta http-equiv="content-type" content="text/html;charset=gb2312" />
<title>blueidea</title>
<style type="text/css">
/*<![CDATA[*/
div {
position:absolute;
top:50%;
left:50%;
margin:-100px 0 0 -100px;
width:200px;
height:200px;
border:1px solid red;
}
/*]]>*/
</style>
</head>
<body>
<div>web标准常见问题大全</div>
</body>
</html>
--------------------------------------
margin:-100px 0 0 -100px;
分别指的是 元素本身高的二分之一 和宽的二分之一, 当为负数的时候 也即是从TOP,LEFT 中的50% 减去了 自身高的二分之一了 这就符合水平垂直居中