CSS Sprites Repeating Images

I was wondering if there is a way to use only one image for repeating and non-repeating images using css sprites. Therefore, in this case, I would like to combine all the images on the page regardless of the width and height, and if they will be used as repeating or non-repeating images. I know that the standard is to create 1 image using all non-repeating images and another image using all repeating images. But I just wanted to know if I could just use 1 image for everything.

Thank.

+5
source share
4 answers

The short answer is no.

The explanation is that the repeating images are displayed in full in any direction that they repeat. Thus, the background that is set to repeat-xdisplay the entire contents of the image in the horizontal direction. This is why you cannot repeat in both directions at the same time using sprites.

+16
source

I know that the standard is to create 1 image using all non-repeating images and another image using all repeating images.

, . . . , .

+2

@Ryan Kinal , , ( ).

- ( ), ( , , , !).

PHPIED, , 3 IE7 MHTML, IE8 , : base 64 file ! IE .

5 4 :

  • no-repeat --
  • repeat-x -
  • repeat-y -
  • MHTML ( IE7 ) background-images
  • , , IE8 + ! IE-

, , .

+2

, . (), , . , .

repeat-x, repeat-y repeat . , scroll 60px -20px (60px - , -20px - ).

0

All Articles