纯 JavaScript:将主体中的绝对位置 div 居中

7el*_*ant 3 javascript centering

在不使用像 jQuery 这样的库的情况下,将绝对位置 div 居中的最简单和最短的方法是什么?谢谢!

编辑:像http://jsfiddle.net/apfwh/ 之类的东西,但也许更干净一点?

fan*_*uka 5

我认为不需要js。CSS 会做到这一点(见这里):

body {
    background: #888;
}

.box {
    width: 100px;
    height: 100px;
    background: #ccc;
    position: absolute;
    left: 50%;
    top: 50%;
    margin: -50px 0 0 -50px;
}
Run Code Online (Sandbox Code Playgroud)

UPD

如果您没有固定的元素宽度/高度:

JS(当元素被打开时):

element.style.margitLeft = -element.offsetWidth / 2
element.style.margitTop = -element.offsetHeight / 2
Run Code Online (Sandbox Code Playgroud)

CSS:

.box {
    background: #ccc;
    position: fixed;
    left: 50%;
    top: 50%;
}
Run Code Online (Sandbox Code Playgroud)