如何在一個(gè)DIV盒子里將圖片居中，除了用margin？p { display:table-cellwidth:134pxheight:134px line-height:134pxborder:1px

如何在一個(gè)DIV盒子里將圖片居中，除了用margin？

p { display:table-cellwidth:134pxheight:134px line-height:134pxborder:1px solid #dededevertical-align:middletext-align:center

*display: block

*font-size: 175px/*約為高度的0.873，200*0.873 約為175*/

*font-family:Arial/*防止非utf-8引起的hack失效問(wèn)題，如gbk編碼*/}

p img {padding:2pxvertical-align:middle max-width:126pxmax-height:126pxwidth:expression(this.width>126&&this.width>this.height?126:this) height:expression(this.height>120?120:this) }

這個(gè)是未知高度圖片 垂直居中

{ vertical-align:middle

max-width:120px

max-height:120px

width:expression(this.width>120&&this.width>this.height?120:this)

height:expression(this.height>120?120:this)

margin-top:expression((120-this.height ) / 2) } 這個(gè)也可以試一下~

CSS中怎么讓圖片在盒子里居中呢？

可以為盒子添加“text-align: center”樣式使圖片在盒子中居中。

1、新建html文檔，在body標(biāo)簽中添加一個(gè)div盒子，然后在這個(gè)div盒子中添加一張圖片：

2、為div盒子和圖片添加一些樣式，這時(shí)默認(rèn)情況下圖片會(huì)向盒子的左上角對(duì)齊：

3、為div盒子添加“text-align: center”樣式，這時(shí)圖片會(huì)在div盒子中居中對(duì)齊：