Tendrias que rearmarlo, esa es una forma mas simple hago desaparecer el texto del div "LINK" y entonces solo queda la img solo te queda ubicar cada div exactamente donde iria la parte que queres que cambie y listo.
Código HTML:
Ver original<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <!--
.contenedor {
width:1000;
}
.img {
background-image:url(/images/bn2.jpg);
width:1000px;
height:1000px;
}
.a1 a
{
margin-top:1; para acomodar
margin-left:1; para acomodar
margin-right:1; para acomodar
margin-bottom:1; para acomodar
* * background-image:url(images/web1.png);
* * background-repeat:no-repeat;
* * width:426px;
* * height:34px;
* * text-decoration:none;
* * display:block;
* * text-indent:-9000px; ACA EL TRUCO
* * padding:0 5px 5px;
}
*
.a1 a:hover
{
margin-top:1; para acomodar
margin-left:1; para acomodar
margin-right:1; para acomodar
margin-bottom:1; para acomodar
* * background-image:url(images/web2.png);
* * background-repeat:no-repeat;
* * width:426px;
* * height:34px;
* * text-decoration:none;
* * display:block;
* * text-indent:-9000px; ACA EL TRUCO
}
-->
<div class="a1"><a href="mi url">LINK
</a></div>