CSSはimage_html/css_WEB-ITnoseの一部の表示を制御します

使用状況: 画像リソースの繰り返しのリクエストを防ぐために、1 つの画像を使用して複数のエフェクトやコンテンツを表示することがよくあります。
紙の垂直方向に画像があるとします。垂直方向の y 軸方向は文字 A、B、C....です。
次に、文字 A、B、C、およびその他の文字をそれぞれ表示したいとします。 CSS は次のように記述できます:
ここの画像の 1 つの文字の width=20px、height=20px
background: url("../images/ranking.gif") no-repeat スクロール0 0px 透明;


. mar_wordB {
背景: url("../images/ranking.gif") 繰り返しなしのスクロール 0 -20 ピクセル 透明
}

.mar_wordC {
背景: url(". ./images/ranking.gif") no-repeat スクロール 0 -40px 透明;
}
......................................
水平方向の画像、X 軸の値を調整するだけです。
注: コンテナ積載物の写真が必要です。

cssコントロール画像display.rar（1.2 kb）