CSS 최적화

Question

digg.com 및 google.com에서 gif 헤더 이미지에 CSS 최적화를 사용하고있는 것으로 나타났습니다. 예를 들어, digg는이 이미지 http://digg.com/img/menu-current.gif을 사용합니다.

이 기술을 사용하는 이유와 내 사이트에서이 기술을 사용하는 이유는 무엇입니까?

관련,

Answer 1

CSS 스프라이트 : 죽음의 이미지 슬라이스의 키스 :
A List Apart

• Smashing Magazine
• 에서 또 다른 기사 해킹이 기술의 목적 support IE6

에 모든 이미지를 결합하여 HTTP 요청을 줄이는 것입니다. .

Answer 2

이러한 것을 CSS 스프라이트라고합니다. 이 매개 변수는 서버 요청 수를 줄이는 데 사용됩니다.

체크 아웃 그들에 대한이 좋은 문서는 : http://www.alistapart.com/articles/sprites/

Answer 3

그것은라고 나는이가 스플 라이스 라고 (또는이 스프라이트입니다)된다 믿는 css sprite

Answer 4

; 기본적으로 이미지는 한 번만 전체 이미지를로드하고 CSS에 일부만 표시하도록 지정합니다. 이렇게하면 많은 양의 이미지를로드하지 않아도됩니다.

연속 된 이미지가 즉시로드되므로 페이지에 더 많은 응답을 추가합니다.

언급 된대로 @A List Apart 문서를 확인하십시오.

Answer 5

그들은이 기술을 사용하여 잠재적으로 여러 이미지를 다운로드하기 위해 여러 연결을 만드는 브라우저가 아니라 하나의 이미지가 다운로드됩니다.

그런 다음 "background-position"및 "width"와 같은 CSS 속성 조합을 사용하여 이미지를 CSS 배경 이미지로 "자르기"할 수 있습니다.

내가 쓰는 동안 다른 사람들이 게시하는 링크에는 아마도 이미지를 자르기위한 좋은 기술이있을 것입니다.