CSS Sprite Generator: у меня есть изображение в комплекте

Question

У меня есть изображение, которое я хочу использовать в качестве спрайта.Допустим, изображение имеет прямоугольники RXC того же размера, которые должны использоваться в качестве фона.Учитывая размеры на следующем рисунке, как мы можем сгенерировать CSS для контейнеров с классами от R1C1 до RnCm ?Используемые символы определены под изображением.

OH = Наружная высота, OW = Наружная ширина,
IH = Внутренняя высота, IW = внутренняя ширина,
VG = вертикальный желоб, HG = горизонтальный желоб

PS Я не уверен, правильно ли я использовал VG и HG илиони должны быть поменяны местами на изображении, пожалуйста, игнорируйте это, если последнее имеет место.

Answer 1

Я нашел этот урок , который объясняет технику в очень простых терминах и пошагово.Я буду использовать его и построить инструмент.Тогда я поделюсь этим здесь.

PS Я бы все равно принял ответ, если бы он содержал конкретную помощь и руководство.

Answer 2

CSS не является динамическим, поэтому, если вы не против написания каждого правила вручную или использования такого инструмента, как Dreamweaver ... вы можете рассмотреть возможность использования динамического языка фреймворка CSS, такого как LESS или SASS для создания начальных стилей.

Answer 3

Может быть, вы можете попробовать генератор спрайтов CSS . Я сам не пробовал, но он должен принимать любое количество изображений и выводить правильный спрайт и код CSS.