21-01-2012, 20:57
(Ten post był ostatnio modyfikowany: 21-01-2012, 20:58 przez Kartofelek.)
robisz 1 obrazek który ma w sobie 2 grafiki - jedna pod drugą (czyli ma wymiary 117x100)
potem stylujesz guzik:
potem stylujesz guzik:
Kod:
a.menu {
display:inline-block;
*display:inline;
width:117px;
height:50px;
text-align:cente;
font:bold 12px Arial;
color:#fff;
line-height:50px;
overflow:hidden;
background:url(podswietlony_obrazek.jpg) 0 0 no-repeat; /* 0 0 = top left */
}
a.image:hover {
background-position:0 -50px /* w twoim przypadku 0 -50px = left bottom, bo wysówasz obrazek o -50px w górę tak w widocznym tle widoczna była druga część grafiki */
}