1、通过（浏览器显示区域的宽高—弹出框的宽高）/ 2计算出弹出框定位的top和left
box-center-1 复制代码
2、这种方法在元素的宽高不固定时会全屏拉伸元素，在高度不固定靠子元素撑开自适应的情况下不适用。但是在宽高固定的情况下可以用，而且没有兼容性问题
box-center-2 复制代码
3、用top:50% left:50%定位后元素的左上角会处于页面中间，然通过transform:translateX(-50%) translateY(-50%)是CSS3的新写法，让元素相对于他自身的宽高反向移动。配合上面的代码就能实现居中定位，而且适用于不确定宽高的元素，但是在低版本IE不兼容
box-center-3 复制代码
基础知识点：
document.body.style.width 返回当前元素的宽度（元素宽度）
document.body.offsetWidth 返回当前元素的宽度（元素宽度+内边距）
document.body.clientWidth 返回当前元素的宽度（元素宽度+内边距+边框）
window.innerWidth 返回当前浏览器屏幕的可见区域的宽度（包含滚动条）
window.screen.availWidth 返回当前浏览器屏幕的可用宽度(通常与屏幕宽高一致)
window.screen.width 返回当前屏幕宽度(分辨率值)
window.document.body.offsetHeight 返回当前网页高度
window.document.body.offsetWidth 返回当前网页宽度