CSS Sprites. Jak wykorzystać jeden obrazek wiele razy na stronie WWW?

Wow, codziennie się uczę. Przygotowujesz jeden obrazek i za pomocą prostych technik CSS wykorzystujesz go dowolną liczbę razy. Polecam!

[otello]

Rany przestańcie, normalnie jakbym był na forum dla bogów którzy to wszystko wiedzą.

Narzekacie jak stare mohery. Tło się zmieni i będzie kupa bla bla bla to ustaw przeźroczyste tło w gifie. Problem rozwiązany. Nie widzę dlaczego to miałoby się rozwalić gdy będzie to rozszerzone w pionie czy poziomie. Pod ie6 też nie powinno się rozwalać (to nie ta bajka, że to nie działa pod ie6) i nie jest to żaden hack tylko

[Reinmar]

Dokładnie. Lubie czytać komentarze pod wpisami dotyczącymi CSSa, bo mogę się z powrotem poczuć jak w gimnazjum :)

Co do samego nawyku ładowania grafik w jeden plik, to jasne - to bardzo dobry nawyk, szczególnie jeśli chcemy zaoszczędzić na procesorze i łączu. Jednak nie w każdej sytuacji da się skorzystać z tego (choćby jeśli tło ma się powtarzać).

Mnie jednak boli (jak zawsze) to jaki kod html do tego napisali. Później się dziwić, że

[look997]

Oczywiście w IE6 nie działa...

[c.....d]

@koobs: I jak wyśle się tą przestarzałą przeglądarkę na bambus.

[koobs]

Działa jak się to zrobi zgodnie z regułami CSSa ;)

[Kisiol_Ent]

No zayebista sztuczka... wrecz genialna... zakop.

jak ktos chce sie pouczyc CSS to se jakis kurs wklepie w google. proste.

[phmn]

Hej, wszechmocni webmasterzy! :)

Nie musicie się tak wysilać się z fachowymi komentarzami (pojazdami) po mniej doświadczonych kolegach. Z gradientami sobie nie umiecie poradzić?

Wanna fun?

http://www.onet.pl/_x/sidebar/cssg/skin00/59a2f93c53ddf11c48234a5888b2164f,skin00.gif

[Tranquil]

Heh, dokładnie :)

http://www.gazeta.pl/i/hp/nq/sprite-wbg-1.5.5.png

[L.....4]

Ja żadnych obrazków nie obieram, dlatego strony szybciej się ładują.

[Raito_l33t]

No proszę, mamy polskiego stallmana!

[L.....4]

Nie, ja po prostu widzę, że w artykule ktoś "zjadł" literkę.

[Izotopus]

Ojej.. No tragedia... :) Spodziewałem się jakiegoś ciekawego przykładu a tu taka kicha ... :)

Dla IE trzeba dać w divach owerflow:hidden; gdyż ten domyślnie ustawia minimalną wysokość na wartość line-height .. To po pierwsze..

Po drugie, pomyślcie co się stanie jak rozciągniemy stronkę w pionie..

Po

[look997]

jak się rozciągnie stronę w pionie to się nic złego nie dzieje, nie rozumiem o co ci chodzi?

[aky]

spoko, zamienic gif'a na przezroczystego png i bedzie dzialac z dowolnym tlem :)

pomijajac fakt zlego wyswietlania przezroczystych png w ie6

[lolo1976]

Nic nie rozumiem z tego Waszego bełkotu.

Czy ktoś zrozumie coś z mojego?

Poszukuję blachoszczelki do naddźwiękowego podciśnieniowego pelengatora hydrostatycznego elektrogumonapawarki z przyczułapkami do hipertermobulgulatora wstecznego ślimakowicy boczno-spadowej z ryflem grzyla gulgownicy

Tego szukam ja, Pafnucy Okapiński, czyli Wujek Dobra Rada.

[c.....d]

@Magnes: Te stare dobre czasy produkcji blachoszczelek do naddźwiękowego podciśnieniowego pelengatora hydrostatycznego elektrogumonapawarki z przyczułapkami do hipertermobulgulatora wstecznego ślimakowicy boczno-spadowej z ryflem grzyla gulgownicy. Aż się łezka w oku kręci.

[M.....s]

Możesz mieć problem, bo blachoszczelki do naddźwiękowego podciśnieniowego pelengatora hydrostatycznego elektrogumonapawarki z przyczułapkami do hipertermobulgulatora wstecznego ślimakowicy boczno-spadowej z ryflem grzyla gulgownicy przestały być produkowane kilkanaście lat temu, teraz możesz co najwyżej kupić nowszy model blachoszczelki do naddźwiękowego podciśnieniowego pelengatora hydrostatycznego elektrogumonapawarki z przyczułapkami do hipertermobulgulatora wstecznego ślimakowicy boczno-spadowej z ryflem brylującym hipergrzyle.

[L.....4]

Promocja... , zaminusować.