CSS：画像内の指定位置から別の指定位置まで画像を繰り返します。

Question

36px（高さ）と32px（幅）の画像があります。最初と最後の5ピクセルにアクセスしています

background-position: 0 0; 
background-position: -26px 0px; 

これらは幅5pxの2つの異なるdivに配置されています。全体的に私は3つのdiv（左、中央、右）を持っています

これで、画像の中央部分を280pxの幅で繰り返すことにしました。しかし、私は6px〜26pxの間の画像領域にアクセスしたいだけです。

IMAGE：

5px  22px 5px 
=== =========== === 

私はCSSが何をしたいか：

DIV

5px     280px      5px 
=== ============================================ === 

注：280pxは、上記の画像では、Xに沿って繰り返さ22pxの領域のみです！あなたは次のようにあなたのスプライトのレイアウトを変更する必要があります

Answer 1

：

----------------------- 
-Left Part Right Part- 
-  Middle Part  - 
----------------------- 

この道を、あなたはbackground-imageの中央部のためy座標を変更するだろうし、それが繰り返さなければなりませんうまくいった。

これは、background-imageの特定の部分を繰り返すことができないためです。この場合、幅/高さを固定する必要があります。一度パーツを繰り返すと、スプライトの他の部分が表示されます。