如何将div放在屏幕中央？

Question

实际上在当前视图的中心,首先是所有其他对象.跨浏览器,没有第三方插件等

通过CSS或Javascript

更新:

我试图使用Javascript的Sys.UI.DomElement.setLocation(),但这个定位对象不在绝对位置,而是相对于它的父级.
是否存在放置绝对位置的功能？

Answer 1

要让它在浏览器中居中,无论页面滚动(可能是你想要的),position:fixed都会更可靠.修改mike108的代码:

<style type="text/css"> 
.centered {  
  position:fixed;
  z-index: 100;  
  top:50%;  
  left:50%;  
  margin:-100px 0 0 -100px;  
  width:200px;  
  height:200px;  
}  
</style>

这假设您有一个固定大小的盒子.如果你没有固定大小的框,你需要使用Javascript来测量窗口和div并明确定位它(再次,修复可能是要走的路).

不过,请在所有浏览器上进行测试.可能有一些我们没有想到的东西.

我实际上建议你看一下这样做的Javascript插件,至少是一个起点.他们已经弄明白了,即使你不想使用他们的代码.我想我用jqModal作为起点.

Answer 2

<style type="text/css"> 
.Div1 {  
position:absolute;  
top:50%;  
left:50%;  
margin:-100px 0 0 -100px;  
width:200px;  
height:200px;  
border:1px solid #9999FF;  
}  
</style> 


<div class="Div1">
</div>