css中把div放在中间

在使用CSS做页面布局时，有时需要把内容DIV放在页面的中间位置。这时可以使用一些方法来实现，下面就为大家介绍一些常用的方法。

    #Box {
        position: absolute;
        top: 50%;
        left: 50%;
        margin-top: -150px; /* 高度的一半 */
        margin-left: -200px; /* 宽度的一半 */
        width: 400px;
        height: 300px;
        background-color: #ccc;
    }

这段代码使用了绝对定位，设置了top和left的值都为50%，这样就使得#Box DIV居中，但是此时会发现#Box的左上角位置并不是页面的中心。这是因为#Box的大小还没有确定，因此需要设置宽度和高度。

还可以使用以下方法实现DIV居中

    #Box {
        margin: 0 auto;
        width: 400px;
        height: 300px;
        background-color: #ccc;
    }

这段代码使用了margin属性，把左右margin都设置为auto，这样就使得内容DIV居中。但是需要注意，这个方法只适用于内容DIV是块级元素（display:block）的情况下，对于行内元素是无效的。

总结起来，实现DIV居中还是比较简单的，可以根据具体情况选择不同的方法，从而使得页面布局更加美观。