<!doctype html> <html> <head> <meta http-equiv="content-type" content="text/html; charset=utf-8" /> <title>使DIV相对窗口大小左右拖动始终水平居中</title> <meta name="keywords" content="" /> <meta name="description" content="" /> <style type="text/css"> body{ margin:0px; } #parentBox{ /* 父盒子 */ max-width:100%; min-height:400px; height:auto; /*声明高度自适应*/ padding:50px 0px; /*内边距可以指定*/ background:#ccc; } #centerDIV{ /* 子层 */ width:60%; /*相对父DIV宽度比例*/ height:auto; /*声明高度自适应*/ margin:0px auto; /*水平居中*/ background:yellow; } </style> </head> <body> <div id="parentBox"> <div id="centerDIV"> 使DIV相对窗口大小拖动始终水平居中：<br /> 窗口左右（水平）拖动时，DIV层随窗口宽度变化而变化，始终水平居中。<br /><br /> abcdefg<br /> abcdefg<br /> abcdefg<br /> abcdefg<br /> abcdefg<br /> abcdefg<br /> abcdefg<br /> abcdefg<br /> abcdefg<br /> abcdefg<br /> abcdefg<br /> abcdefg<br /> abcdefg<br /> abcdefg<br /> abcdefg<br /> abcdefg<br /> abcdefg<br /> abcdefg<br /> abcdefg<br /> </div> </div> </body> </html>