日期:2014-05-17  浏览次数:20604 次

垂直方向剧中问题
使用div,div 的内容在body中垂直剧中,并且能够使多数浏览器兼容!使用一些总是达不到理想的效果!恳请达人赐教

------解决方案--------------------
HTML code
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<style type="text/css">
#demo {
    border:1px solid #999;
    background-color:#EEE;
    height:200px;
    position:absolute;
    top:50%;
    margin-top:-100px; /*margin-top值为高度值的50%*/
}
</style>
</head>

<body>
<div id="demo">DEMO</div>
</body>
</html>

------解决方案--------------------
HTML code

<!DOCTYPE HTML>
<html>
    <head>
        <meta charset="gb2312" />
        <title></title>
        <style>
            .test {
                position:absolute;
                width:100px; height:100px;
                border:1px solid red;
            }
        </style>        
    </head>
    <body>
        <div class="test" id="test"></div>
        <script>
            var obj = document.getElementById('test');
            obj.style.left = (document.documentElement.clientWidth - obj.clientWidth) / 2 + 'px';
            obj.style.top = (document.documentElement.clientHeight - obj.clientHeight) / 2 + 'px';
        </script>
    </body>
</html>

------解决方案--------------------
http://www.html-5.cn/div-css/jishu/1908.html