之前想让一段文字水平垂直居中，必须知道这段文字的宽高，这样一来，就把文字设定死了，不可扩展了。现在有一个好的办法来解决这个问题了。
使用margin-top:50%;transform:translateY(-50%)，这样让文字垂直居中，text-align:center，这样让文字水平居中
例子：
<style>
.demo{width:300px;height:300px;position:relative;background:#f0f0f0;border-radius:50%;}
.mask{width:300px;height:300px;text-align:center;position:absolute;top:0;left:0;}
.info{margin-top:50%;transform:translateY(-50%);font-size:12px;color:#333;}
</style>
<div class="demo">
<div class="mask">
<div class="info">
description goes hear<br>
description goes hear
</div>
</div>
</div>
显示效果：
