V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
wenqiang
V2EX  ›  编程

请教,如何让div中的图片居中?

  •  
  •   wenqiang · 2012-11-09 12:01:10 +08:00 · 3467 次点击
    这是一个创建于 4203 天前的主题,其中的信息可能已经有所发展或是发生改变。
    不是让div居中,是div里边的图片全部默认水平居中。css怎么实现?
    7 条回复    1970-01-01 08:00:00 +08:00
    paloalto
        1
    paloalto  
       2012-11-09 12:03:26 +08:00
    外层的容器加一个text-align:center;
    chone
        2
    chone  
       2012-11-09 12:07:04 +08:00
    也可以把img的display设为block,然后margin左右设为auto;
    wenqiang
        3
    wenqiang  
    OP
       2012-11-09 12:16:06 +08:00
    @paloalto 那样不行,那样div里的文字也全部居中了。只想要图片居中。
    paloalto
        4
    paloalto  
       2012-11-09 12:19:25 +08:00
    文字外层再加一个div呗。
    wenqiang
        5
    wenqiang  
    OP
       2012-11-09 12:22:05 +08:00
    @chone 这个ms可以,非常感谢!
    anyforever
        6
    anyforever  
       2012-11-09 14:45:07 +08:00
    @wenqiang 外层的容器里包含的不只有图片,那就给它加一个class,然后在css里 .classname img{text-align:center;}
    chinazdg
        7
    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;
    }
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   实用小工具   ·   3230 人在线   最高记录 6547   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 24ms · UTC 14:45 · PVG 22:45 · LAX 07:45 · JFK 10:45
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.