前端排版的时候，常常会碰到图片在一个区域在正中间，水平居中很容易做到，外层样式用{text-align:center}就可以水平居中;如果知道图片的高度，垂直居中可以在外层样式加padding样式，如果图片高度不知道的情况，又怎么做呢？工具/原料more做网页的工具都行 ，比如：Dreamweaver,Aptana Studio,EditPlus等，记事本也可以。方法/步骤1/6分步阅读

在这里我用的是EditPlus，双击打开

2/6

点击左上角，文件》新建》html网页

3/6

在图片标签img src=xxx /之前加一个行内元素，比如加个span/span就行了。

4/6

给外层div加上text-align:center;

给span的样式display:inline-block;height:100%;vertical-align: middle;

给图片加上vertical-align: middle;

5/6

显示结果

6/6

文字居中 设置行高line-height等于外层的高度就行了。

注意事项

图片的大小不能大于外层div的大小，所以最好给图片加上max-width,max-height样式。