画像を表示させるとき、何枚もの画像を読み込むと時間がかかる。
そこで、その複数の画像を1枚にまとめて、1枚だけの画像を読み込むようにする。
そして、cssで表示範囲を指定することによって、表示させたい画像を表示させる。
また、通常時・マウスオーバー時・クリック時・表示時など、類似した画像を管理しやすくする利点もある。
デメリット
サイズなどに変更があったとき、画像だけでなく、cssも書き換えなければならないのでとても面倒。
ピクセルで表示範囲を指定するので、画像を作ったり、またその指定が少し大変かも。
alt属性が使えない。
背景画像のリピート表示ができない。
詳しく書いてあるサイト
CSSスプライトについてあれこれ。
http://lopan.jp/css-sprites/