如何让div上下左右都居中

时间：2021-06-22 23:33:03

在做登陆页面的话，需要login的div 上下左右都居中。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"

"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="gb2312" >

<head>

<title>居中Demo</title>

</head>  

<mce:style type="text/css" title="currentStyle" media="screen">

<!--

#divcenter{

   position:absolute;/*层漂浮*/

   top:50%;

   left:50%;

   width:300px;

   height:300px;

   margin-top:-150px;/*注意这里必须是DIV高度的一半*/

   margin-left:-150px;/*这里是DIV宽度的一半*/

   background:yellow;

   border:1px solid red;

}

-->

</mce:style>

<style type="text/css" title="currentStyle" media="screen" mce_bogus="1">

#divcenter{

   position:absolute;/*层漂浮*/

   top:50%;

   left:50%;

   width:300px;

   height:300px;

   margin-top:-150px;/*注意这里必须是DIV高度的一半*/

   margin-left:-150px;/*这里是DIV宽度的一半*/

   background:yellow;

   border:1px solid red;

}

</style>

</head>

<body>

<div id="divcenter">

this is a test

</div>

</body>

</html>

参考地址：http://blog.csdn.net/carlfan/article/details/4579590参考地址：

相关文章