点评:正如标题所言根据已知高和宽绝对垂直居中div,下面有个不错的示例,大家可以参考下
DRPHTML5中文学习网 - HTML5先行者学习网
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> DRPHTML5中文学习网 - HTML5先行者学习网
<html xmlns="http://www.w3.org/1999/xhtml"> DRPHTML5中文学习网 - HTML5先行者学习网
<head> DRPHTML5中文学习网 - HTML5先行者学习网
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> DRPHTML5中文学习网 - HTML5先行者学习网
<title>已知宽高度DIV垂直水平居</title> DRPHTML5中文学习网 - HTML5先行者学习网
<style type="text/css"> DRPHTML5中文学习网 - HTML5先行者学习网
<!-- DRPHTML5中文学习网 - HTML5先行者学习网
.main{ position:absolute; top:50%; left:50%; width:821px; height:392px; margin:-196px 0 0 -410.5px; background:#C8EDFB} DRPHTML5中文学习网 - HTML5先行者学习网
--> DRPHTML5中文学习网 - HTML5先行者学习网
</style> DRPHTML5中文学习网 - HTML5先行者学习网
</head> DRPHTML5中文学习网 - HTML5先行者学习网
<body> DRPHTML5中文学习网 - HTML5先行者学习网
<div class="main">已知宽高度DIV垂直水平居</div> DRPHTML5中文学习网 - HTML5先行者学习网
</div> DRPHTML5中文学习网 - HTML5先行者学习网
</body> DRPHTML5中文学习网 - HTML5先行者学习网
</html> DRPHTML5中文学习网 - HTML5先行者学习网
DRPHTML5中文学习网 - HTML5先行者学习网说明:
DRPHTML5中文学习网 - HTML5先行者学习网width:821px; height:392px
DRPHTML5中文学习网 - HTML5先行者学习网margin的取值为高和宽的一半