이미지스프라이트

약방의 감초같은 image sprite기법으로 이모티콘 넣기

img 스프라이트 기법 여러 이미지들을 하나의 이미지로 만들어 background-position 속성으로 이미지 좌표 값을 이용하여 사용하는 기법 위의 로그인 리스트에서~ 구글, 페이스북, 네이버, 카카오 각각의 이미지들을 넣어준 게 아니라 1개의 이미지만 사용했다는 사실! 처음엔 컨셉이 헷갈릴 수 있으나, 아래 과정을 보면 생각보다 엄청 쉽다는 걸 알 수 있다. 왜 사용할까? 한장의 사진만으로 여러번 다른이미지들을 넣을 수 있으니까 당연히 소스절약 이는 로딩시간 단축으로 이어진다! (간단한 웹페이지는 별 차이 없겠지만, 네이버나 다음과 같은 한 페이지 안에 어마무시한 수의 이미지가 들어가는 사이트를 생각해보자..) 주의점 alt값이 들어가야 하는 의미가 있는 사진에는 적합하지 않다. 글의 악세사리처럼..