Красивая реализация ссылки ввиде картинки и текста

Ссылка ввиде картинки, как сделать так чтоб при наведении курсора на эту картинку, она исчезала и мы видели обыкновенную ссылку, средствами XHTML/CSS?

Надо использовать метод замещения текста картинкой, где картинка закрывает текст, путем присваивания ей (картинке) абсолютного позиционирования и поднимая её по оси z (position:absolute;z-index:100; ) . Так вот - идея проста. Поднимаем картинку, под ней у нас текст ссылки и при наведении на ссылку мышки (a:hover) картинка исчезает (display:none)

<style type="text/css">
.container a{
    text-align:center;
    display:block;
    position:relative;
    height:80px;
    width:80px;
    padding:10px;
    background:#000;
 }
.container a img{
    position:absolute;
    z-index:10;
    top:10px;
    left:10px;
    border:none;
 }
.container a:hover img{
    display:none;
    _filter:alpha(opacity=100);
 }
</style>

<div class="container"> <a href="http://myopinion.net.ua">
  <img src="images/cat.jpg" alt="" width="80px" height="80px" />
  кошки-мышки:)       
 </a>
</div>

Как выглядит:

кошки-мышки:)