图片在div中居中显示

1、固定图片宽高，垂直居中显示在div中

注意：div在div中垂直居中同样适用

.images{
	position:relative;
	width:400px;
	height:400px;
	overflow:hidden;
}
.images img.one{
	position:absolute;
	width:200px;
	height:200px;
	top:50%;
	left:50%;
	margin-top:-100px;
	margin-left:-100px;
}
<div class="images">
	<img class='one' src='1.png' alt=''>
</div>

2、图片自适应垂直居中显示在div中

.images{
	position:relative;
	width:400px;
	height:400px;
	overflow:hidden;
}
.images img.two{
	position: absolute;
    max-width: 100%;
    height: auto;
    top: 50%;
    left: 50%;
    transform: translate3d(-50%,-50%,0);
    -webkit-transform: translate3d(-50%,-50%,0);
}
<div class='images'>
	<img class='two' src='1.png' alt=''>
</div>