图片垂直居中对齐

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <style type="text/css">
    *{
    	padding:0;
    	margin: 0;
    }
	.box{
            margin:30px auto;
		width:400px;
		height:400px;
		line-height:400px;
		border: 1px solid #bbb;
	}
	.box img{
		display:inline-block;
		width:100%;
		vertical-align:middle;
	}
    </style>
</head>

<body>
    <div class="box">
    	<img src="finish.png">
    </div>
</body>
</html>

posted @ 2016-05-11 16:30  害羞熊5  阅读(373)  评论(0编辑  收藏  举报