На некоторых сайтах я заметил одну вещь: они используют одно изображение BIIIIIIIG, содержащее множество маленьких изображений, а затем используют CSS background-position
для определения координат каждого изображения , а не использовать отдельные изображения.
Вот где я:
с правильным стилем ( display: inline-block; width: 32px; height: 32px; background-image: url ('spritesheet.png');
), который добавляет еще один класс в смеси.
- Еще много чего я не могу вспомнить сейчас, я их печатаю.
Плюсов за использование большого листа спрайтов
- ... Эээ ... пока нет.
Фактически, единственное, что здесь близко к профессиональному, это то, что когда я разрезал лист на отдельные изображения, результирующая папка занимала 3 МБ на диске (из-за того, что каждый файл был <100 байт и мой размер распределения составляет 4k).Фактические файлы получаются меньше половины размера листа и CSS, поэтому даже с накладными расходами HTTP-запроса есть значительная экономия места .
По сути, мой вопрос: есть ли у кого-нибудь какие-нибудь преимущества для использования большого листа поверх отдельных изображений?
28
задан Niet the Dark Absol 8 November 2011 в 12:11
поделиться