Link
Link
Üstteki link yazılarını görsel olarak düşünün alt alta farklı çizilmiş simetrik resimler. Bu tek bir resim olacağı için,
.classadi:hover{background-position:-100px -20px;}
şeklinde yapabilirsiniz. -100px'nini belirtir -20px boyunu belirtir. - almasının sebebi aşağıdaki görseli üstüne gelince görünmesini sağlamak. Böylece hem görseli bir kez yükletmiş olursunuz herhangi bir sorun yaşamazsınız.
hocamın dediklerini css sprite tekniği diye araştırısanız detaylı bilgiler bulabilirsiniz. Büyük Performans sağlıyor bence