这个示例是使用HTML/CSS实现的，对于一个给定宽高的元素，不管有没拖动滚动条，让它始终处于屏幕水平方向和垂直方向居中的位置。
CSS:
<style>
html,body{ height:100%; overflow:hidden;}
body{ overflow:auto}
.test{width:500px; height:500px; position:absolute; left:25%; top:25%; background-color:#000;}
h1{ height:1500px;/*测试滚动条*/}
</style>
HTML:
<body>
<div class="test"></div>
<h1>ph</h1>
</div>
示例分析：
考虑到fixed IE6不支持，所以采用的是绝对定位。对于使用了绝对定位(position:absolute;)的元素，它的位置属性（top/left/bottom/right）的值，默认情况下是根据文档 的根元素<html>进行偏移定位， 如果它的上层元素（祖先元素或父元素）的position值不等于static时，则top/left/bottom/right 根据该元素进行偏移定位。上面的示例中 .test 中top:25%; 表示.test的top值为根元素<html>高度的25%；
当html,body的高度为百分比时，<body>的高度根据父元素<html>来计算，<html>的高度根据可视窗口的高度度来计算，所以在上面的示例中 html,body{ height:100%; overflow:hidden;} 表示<html>、<body>的高度为整个内容可视窗口的高度，并且内容超出一屏时隐藏滚动条，而下面又使用了 body{ overflow:auto} 使得内容超出一屏幕时<body>的滚动条能够显示。所以当拖到滚动条时滚动是body的内容，而基于html进行绝对定位的.test,不会随滚动条滚动始终处于屏幕中间。