注册 登录
编程论坛 ASP技术论坛

习惯了这里,问个div+css绝对居中的问题!!!

xinzheng 发布于 2008-06-12 18:06, 964 次点击
div+css绝对居中问题!!请不吝赐教!!
index.html代码:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"

"http://www.
<html xmlns="http://www.
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>Pink Doll</title>
<LINK
href="css.css" type=text/css rel=stylesheet>
</head>

<body>
<div id="dw">
<div class="aa">aaa</div>
<div class="bb">aaa</div>
<div class="cc">aaa</div>
</div>

</body>
</html>

css.css代码:
#dw
{
width: 300px;
height: 200px;
margin-top:0px ;
margin-left :0px;
margin-bottom :0px;
margin-right:0px;
}
.aa
{
margin-top:0px ;
margin-left :0px;
width: 100px;
height: 200px;
background-color: #000000;
}

.bb
{
margin-top:-200px ;
margin-left :100px;
width: 100px;
height: 200px;
background-color: #999999;
}

.cc
{
margin-top:-200px ;
margin-left :200px;
width: 100px;
height: 200px;
background-color: #666666;
}

可不能绝对居中,不知道为什么?请知道的指教!!
退一步,就算不能绝对居中,能居中就好!!!
但谁要是知道绝对居中那是最好!!!

程序代码:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"

"http://www. xmlns="http://www. http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>Pink Doll</title>
<LINK
href="css.css" type=text/css rel=stylesheet>
</head>

<body>
<div id="dww">
<div id="dw">
<div class="aa">aaa</div>
<div class="bb">aaa</div>
<div class="cc">aaa</div>
</div>
</div>
</body>
</html>


[[it] 本帖最后由 xinzheng 于 2008-6-12 19:17 编辑 [/it]]
5 回复
#2
xiapi2008-06-12 18:25
<div align=center>或者css里加入text-align:center
#3
xinzheng2008-06-12 19:16
我的意思是要<div id="dw"></div>绝对居中
#4
xinzheng2008-06-12 19:47
我找到了,晕
#dw-index
{
background:url('bg-1.jpg') no-repeat;
width: 400px;
height: 400px;
position: absolute;
  top: 50%;
  left: 50%;
  margin-left: -200px;
  margin-top: -200px;
}

居中是居中了,可背景不知道跑哪去了?

[[it] 本帖最后由 xinzheng 于 2008-6-12 20:25 编辑 [/it]]
#5
天涯听雨2008-06-12 21:00
Css 里加:

body{text-align:center;}     'body 里的元某都绝对居中
#6
dhdhzzw2008-06-13 09:31
[bo][un]xinzheng[/un] 在 2008-6-12 19:47 的发言:[/bo]

我找到了,晕
#dw-index
{
background:url('bg-1.jpg') no-repeat;
width: 400px;
height: 400px;
position: absolute;
  top: 50%;
  left: 50%;
  margin-left: -200px;
  margin-top: -200px;
}

居 ...


============
在这一句后面,加   background:url('bg-1.jpg') no-repeat center center;
1