使用css在页面中间居中一个div框 [英] center a div box in the middle of the page using css

问题描述

我想把一个div放在页面的中央，我尝试了 top：30％，但是当窗口调整了大小。 >

I want to center a div right in the middle of the page, I tried top:30%, but when the window is resized off the alignment.

<div id=cent></div>

感谢
Jean

Thanks Jean

推荐答案

如果你知道div的高度/宽度（例如，它将是100px X 200px），那么你可以这样做：

If you know the height/width of that div (for instance, it will be 100px X 200px) then you can do it like this:

#cent {
  position:absolute;
  top:50%;
  left:50%;
  margin-top:-50px; /* this is half the height of your div*/  
  margin-left:-100px; /*this is half of width of your div*/
}

UPDATE： ：请参阅 http://www.w3.org/Style/Examples/007/center （垂直居中）

UPDATE: another option: see http://www.w3.org/Style/Examples/007/center (Centering vertically)

这篇关于使用css在页面中间居中一个div框的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！