html - 如何在背景 div 气球图像中居中放置文本？

Question

我在如何将带有背景图像的 div 中的文本居中时遇到困难。这是我的 fiddle

http://jsfiddle.net/VnqeY/12/

谢谢。

Answer 1

jsFiddle

只需声明line-height并设置 <a>成为vertical-align: middle

.balloon{
    background:url('http://i.imgur.com/B19Zb.jpg');
    background-repeat: no-repeat;
    text-align: center;
    color:#fff;
    font-size:1.1em;
    height:140px;
    width:140px;
    line-height: 118px;  
}
.balloon a{
    vertical-align: middle;
    color:yellow;
    text-align:center
}

<div class="balloon">
    <a href="#">Advertise with us</a>
</div>