CSS sprites 기법

@ CSS Sprites 생성도구 : http://ko.spritegen.website-performance.org/
  : 이미지 압축파일 올려주면 자동으로 만들어준다. 고마운 도구이군.

Image Sprites : http://www.w3schools.com/css/css_image_sprites.asp

An image sprite is a collection of images put into a single image.
A web page with many images can take a long time to load and generates multiple server requests.
Using image sprites will reduce the number of server requests and save bandwidth
- 무슨 말이냐고? 하나의 이미지를 사용하는 이미지 모음을 얘기하는데,
  이를 사용하는 이점은 서버로의 호출을 줄이고 대역폭을 확보하는데 있다.
  이미지 모음을 CSS로 잘라서 사용하라는 말입니다.

예제 1 : http://www.w3schools.com/css/tryit.asp?filename=trycss_sprites_img
예제 2 : http://www.w3schools.com/css/tryit.asp?filename=trycss_sprites_nav
예제 3 : http://www.w3schools.com/css/tryit.asp?filename=trycss_sprites_hover_nav