Отдельные графические изображения затем могут быть отображены путем соответствующего размещения графического изображения в качестве фонового изображения в нужном месте.
Звучит сложно и требует тонкой настройки. Это было бы без следующих полезных инструментов:
Оптимизировать сайт: Если вы хотите оснастить существующий веб-сайт спрайтами CSS (что я рекомендую всем), вам может помочь инструмент SpriteMe.
Просто зайдите на spriteme.org и перетащите отображаемую там ссылку на панель закладок вашего браузера. Теперь вы можете вызвать инструмент, нажав на ссылку.
Затем он анализирует открытый в данный момент веб-сайт и предлагает комбинацию спрайтов, которую можно загрузить непосредственно в виде готовой графики.
SpriteMe также генерирует соответствующий код CSS, который вам нужно только включить на свой веб-сайт вместе с графикой.
Графика спрайтов из отдельных графиков: Чтобы автоматически сгенерировать графику спрайта + код CSS из отдельной графики, вы просто загружаете свою графику в ZIP-архиве в генератор спрайтов CSS. Инструмент сделает все остальное.
Сгенерируйте CSS из графики Sprite: Если вы уже создали графику Sprite самостоятельно и теперь хотите, чтобы соответствующий код CSS обращался к отдельной графике, вы можете использовать Sprite Cow.
Там вы загружаете графику, выбираете отдельные элементы и тут же отображается код CSS.
