请教，如何让div中的图片居中？

V2EX = way to explore

V2EX 是一个关于分享和探索的地方

现在注册

已注册用户请登录

这是一个创建于 4400 天前的主题，其中的信息可能已经有所发展或是发生改变。

不是让div居中，是div里边的图片全部默认水平居中。css怎么实现？

div

居中

图片

7 条回复 • 1970-01-01 08:00:00 +08:00

paloalto

2012-11-09 12:03:26 +08:00

外层的容器加一个text-align:center;

chone

2012-11-09 12:07:04 +08:00

也可以把img的display设为block，然后margin左右设为auto;

wenqiang

2012-11-09 12:16:06 +08:00

@paloalto 那样不行，那样div里的文字也全部居中了。只想要图片居中。

paloalto

2012-11-09 12:19:25 +08:00

文字外层再加一个div呗。

wenqiang

2012-11-09 12:22:05 +08:00

@chone 这个ms可以，非常感谢！

anyforever

2012-11-09 14:45:07 +08:00

@wenqiang 外层的容器里包含的不只有图片，那就给它加一个class，然后在css里 .classname img{text-align:center;}

chinazdg

2013-03-09 21:45:50 +08:00

.box {
/*非IE的主流浏览器识别的垂直居中的方法*/
display: table-cell;
vertical-align:middle;

/*设置水平居中*/
text-align:center;

/* 针对IE的Hack */
*display: block;
*font-size: 175px;/*约为高度的0.873，200*0.873 约为175*/
*font-family:Arial;/*防止非utf-8引起的hack失效问题，如gbk编码*/

width:200px;
height:200px;
border: 1px solid #eee;
}
.box img {
/*设置图片垂直居中*/
vertical-align:middle;
}