网页常见布局，让图片在div中，垂直居中，水平居中

网页常见布局，图片在div中垂直居中，水平居中 

div{text-align:center;border:1px solid #000;width:500px;height:500px;vertical-align:middle;display:table-cell;}
<div>
<img src="1.jpg">
</div>

这个vertical-align：middle；只适用于内联元素，如果想给div垂直、水平居中，则需要把div变设置为内联元素

<style type="text/css">
        .wai{width:500px;height:500px;border:1px solid #000;text-align:center;vertical-align:middle;display:table-cell;}
        .nei{background:#ccc;width:50px;height:50px;display:inline-block;}

</style>

<div class="wai">
        <div class="nei"></div>

</div>