图层居中，可灵活设定边与窗口的距离作者：Neoxone 发表时间： 2008年08月19号，星期二 阅读：4,476 次 <!DOCTYPE html> <html> <head> <meta charset="UTF-8" /> <style type="text/css"> *{margin:0; padding:0;} html,body{width:100%; height:100%;overflow:hidden;} body{margin:100px 0 0 100px;position:relative;} .wrap{height:100%; width:100%; background:#ccc; position:absolute; bottom:200px; right:200px;} .cont{margin:200px 0 0 200px;} </style> </head> <body> <div class="wrap"><div class="cont">1阿斯顿就恢复2阿斯顿就恢复3阿斯顿就恢复4阿斯顿就恢复5阿斯顿就恢复6阿斯顿就恢复7阿斯顿就恢复8阿斯顿就恢复9阿斯顿就恢复10阿斯顿就恢复11阿斯顿就恢复12阿斯顿就恢复13阿斯顿就恢复14阿斯顿就恢复15阿斯顿就恢复16阿斯顿就恢复</div></div> </body> </html> 上面这种方法，应该说很少会被用上。 而下面这个则比较常见， 不过，它是对已确定尺寸的元素的水平与垂直居中。 <!DOCTYPE html> <html> <head> <meta charset="UTF-8" /> </head> <style type="text/css"> body{padding:0;margin:0;background:#f4dcd8;} #Main{position:absolute;width:500px;height:400px;left:50%; top:50%;margin:-200px 0 0 -250px;background:#87b6bc;} </style> <body> <div id="Main"> TEST </div> </html> 相关文章:《未知大小图片在已知容器中居中》《未知尺寸元素（包括块元素）的垂直居中方法探究》 标签： 居中 这篇文章发布于 2008年08月19号，星期二，18:50，归类于 CSS2。 您可以跟踪这篇文章的评论通过 RSS 2.0 feed。 您可以留下评论，或者从您的站点trackback。