如何让2个DIV整体构成的页面居中

来源:百度知道 编辑:UC知道 时间:2024/06/25 10:03:39
<div style="position:absolute;height:100;width:100;background:red"></div>
<div style="position:absolute;margin-left:100;height:100;width:100;background:green"></div>
如何让这两个DIV整体居中?请高手解答,如正确且简单,加分

不知道你需不需要垂直方向也居中,所以只是写了水平方向的,如果需要你再补充。
如果你要的任意高度的DIV,其实高度并不影响他的居中效果,影响居中效果的是position:absolute;width:100px;left:50%;margin-left:-100px;其实这段代码的意思是说,你的DIV是的位置是绝对的,在偏离左边50%的位置,这个偏离是指DIV的左边界偏离页面的50%,那么对于第一个DIV来说,它要的效果是右边界偏离页面的左边50%,那么我们可以通过margin-left来实现它,给它设置负值,这个值刚好等于左边的DIV的宽度就可以解决问题了。

如果你还不明白,那你再给我留信息。

<div style="position:absolute;height:100px;width:100px;background:red;left:50%;margin-left:-100px;"></div>
<div style="position:absolute;height:100px;width:100px;background:green;left:50%;"></div>

width:100px;left:50%;margin-left:-100px;
这样写,只能适合左边是100宽,右边也恰巧是100宽,假如其中一个的宽变了,也就不能实现了。

还有,楼主,你写的样式怎样不加单位呢?

我找了一个办法,用javascript来实现,两个层的宽可以更改而不需要改JS,都会居中。
http://www.twycn.com/article.php?act=art_info&art_id=55