用css 如何让div在自己的容器里居中 - 编程论坛

#2

dzt00012011-06-09 13:07

没明白

#3

a7688419692011-06-09 13:21

原来的截图是这样的

只有本站会员才能查看附件，请登录

我现在要把它居中

只有本站会员才能查看附件，请登录

这个居中不要像这样弄
<div align="center">
<div style="background:#FF0000; width:950px;">nihao</div>
</div>

要在<div style="background:#FF0000; width:950px;">nihao</div>里加个属性让它居中，怎么实现啊

#4

yms1232011-06-09 15:06

如果单让背景居中，可以使用图片的话可以做一张背景图片
然后css设置如下
    background-image: url(图片的url地址);
    background-repeat: no-repeat;
    background-position: center;
这样背景图片就肯定居中了

#5

DanYang_dan2011-06-09 15:36

<div style="background:#FF0000; width:950px;" align="center">nihao</div>

这样不可以吗？
如果不行可以按楼上的实验哦..

你语文肯定不及格..

#6

a7688419692011-06-09 15:49

只能背景才能居中吗，我这里只是我自己举得一个例子，实际上还有许多东西的。有没有其它的办法啊

#7

dzt00012011-06-09 17:26

背景色是不能居中的，只能全部填满。背景图片可以。
不知道楼主到底要居中什么东西？

#8

a7688419692011-06-10 09:09

<title>无标题文档</title>
<style type="text/css">
.indexlogin{background-color: #f5f5f5;height:70px;width:50%;float:left;margin-bottom:8px;clear:left; text-align:left;}
.indexlogintitle{display:none;}
.indexloginbody{height:54px !important;height:70px;width:100%;padding:8px;}
.indexlogined{clear:left;background-color: #f5f5f5;height:54px !important;height:70px;width:50%;float:left;margin-bottom:5px;margin-right:-16px;line-height:180%;padding:8px;}
</style>
</head>

<body>
<div style="background:#FF0000; width:950px; text-align:center">nihao</div>
<div class=indexlogin><div class=indexlogintitle>用户登陆</div><div class=indexloginbody>
<form method=POST action=login.asp?action=login><p style='margin:4px;'>用户名：<input style='width:70;' name=lgname>  密码：<input type=password style='width:70;' name=lgpwd></p><p style='margin:4px;'>记   录：<select name=cook style='width:70;'><option value=0>不保存</option><option value=1>保存一天</option><option value=30>保存一月</option><option value=365>保存一年</option></select>  <input type=hidden name=lgtype value=1> <input type=submit value=' 登陆 ' name=Submit></p></form>
</div></div>
</body>
</html>

#9

skip152011-06-10 16:56

text-align:center

#10

madpbpl2011-06-11 12:03

<div style="background:#FF0000; width:950px; margin:0 auto">nihao</div>

#11

a7688419692011-06-11 14:17

那我下面的内容也能实现你这个效果吗怎么实现
<div class=indexlogin><div class=indexlogintitle>用户登陆</div><div class=indexloginbody>
<form method=POST action=login.asp?action=login><p style='margin:4px;'>用户名：<input style='width:70;' name=lgname>  密码：<input type=password style='width:70;' name=lgpwd></p><p style='margin:4px;'>记   录：<select name=cook style='width:70;'><option value=0>不保存</option><option value=1>保存一天</option><option value=30>保存一月</option><option value=365>保存一年</option></select>  <input type=hidden name=lgtype value=1> <input type=submit value=' 登陆 ' name=Submit></p></form>
</div></div>

#12

samuelchen2011-06-13 09:00

可以将CSS独立写在一文本
然后设置居中属性。

#13

jimmy9052011-06-28 00:33

还是没有明白

#14

cRazy谢不清2011-06-28 08:26

HTML+CSS居中的三种常见方法！老师教的
1.在父元素中text-align:center
2.把要居中的地方用"<center></center>"包括起来。
    这个方法我们班都叫他“强制居中”，还没出现过不行的情况~~  不过这个方法有个弊端，被包括起来的所有元素都会强制居中！就是说，我让DIV在BODY中居中但是DIV里的文字和其他元素不需要居中  他也会给我居中了，所以一般不推荐
3.margin-left:auto;这个用得比较多。他可以根据页面大小自动调整让元素居中  。不过有个前提就是元素必须要有固定宽度。
  就是说 "margin-left:auto; width:200px/width:20%"这样才起效  相应的水平居中也一样不过用得比较少 margin-top:auto!