14-02-2011, 20:58
(Ten post był ostatnio modyfikowany: 14-02-2011, 21:00 przez Kartofelek.)
a bardzo prosto:
HTML:
Obrazek ma postać:
style mają postać:
Zrozumiał?
Niestety w technice sprite CSS wychodzi ułomność Firefoxa :}, który jako jeden z nielicznych nie obsługuje background-position-y, co jest w moim odczuciu jednym z większych baboli. Czemu? Odpowiedz sobie sam (odpowiedzi szukaj w klasach).
Ah powinienem pisać kursy ;] A nie sory przecież ja już to robię
HTML:
Kod:
<a href="" id="link1">Cos</a>
<a href="" id="link2">Cos2</a>
Obrazek ma postać:
Kod:
[ 1off ][ 2offf ]
[ 1hover ][ 2hover ]
[ 1active ][ 2active ]
style mają postać:
Kod:
a {float:left; width:100px; height:20px; display:block; background:url(XXXX.jpg) no-repeat; siała baba mak....}
#link1 {background-position:0 0;}
#link1:hover {background-position:0 -20px;}
#link1.aktywny {background-position:0 -40px;}
#link2 {background-position:-100px 0;}
#link2:hover {background-position:-100px -20px;}
#link2.aktywny {background-position:-100px -40px;}
Zrozumiał?

Niestety w technice sprite CSS wychodzi ułomność Firefoxa :}, który jako jeden z nielicznych nie obsługuje background-position-y, co jest w moim odczuciu jednym z większych baboli. Czemu? Odpowiedz sobie sam (odpowiedzi szukaj w klasach).
Ah powinienem pisać kursy ;] A nie sory przecież ja już to robię