如何实现文字在图片中间的效果

.vcenter {position:absolute;left:50%;top:50%;
    transform: translate(-50%,-50%);}

<div>
        <img src='xx' />
        <div class="vcenter">center</div>
</div>