a {
    display: block;
    width: 300px;
    height: 100px;
    background: url('button.png') no-repeat;
    text-align: center;
    line-height: 100px;
    color: black;
    text-decoration: none;
}
a:hover {
    background: url('button-on.png') no-repeat;
}
<a href="index.html">Witaj</a>

Listing 39.3. Wyśrodkowanie etykiety tekstowej

Rozdział 39. Przyciski rollover w CSS