2、如何给未知宽高的图片垂直居中？有几种办法？

（1）背景法

<div class="wrap"></div>

.wrap{
	width:300px;
	height:200px;
	background: url(../img/test.jpg) center center no-repeat;	
}

(2) 图片外面用个p标签，通过设置line-height使图片垂直居中(兼容性较好)

<div class="wrap">
    <img src="./img/test.jpg">
</div>

.wrap{
    width: 300px;
    height: 300px;
    border: 1px solid #000;
    text-align: center;
}
.wrap p{
    width: 300px;
    height: 300px;
    line-height: 300px;
}
.wrap p img{
    *margin-top:expression((300 - this.height )/2);
    vertical-align: middle;
}

(3)display:table-cell(不支持IE6和7)

<div class="wrap">
    <img src="./img/test.jpg">
</div>

.wrap{
    width: 300px;
    height: 200px;
    border: 1px dashed #ccc;
    display: table-cell; 
    vertical-align: middle;
    text-align: center;
}

（4）添加table标签(兼容性好，但是冗余标签比较多)

<div class="wrap">
    <table>
        <tr>
            <td align="center"><img src="./img/test.jpg"/></td>
        </tr>
    </table>
</div>
.wrap{
    width: 300px;
    height: 200px;
    border: 1px dashed #ccc;
    text-align: center;
}
.wrap table{
    width: 300px;
    height: 200px;
}