Я использую компас для создания изображений спрайтов. И у меня МНОГО значков спрайтов, и они генерируют слишком много кода CSS (слишком много селекторов классов для фонового изображения). Итак, давайте проанализируем код спрайта компаса:
как вы можете видеть здесь http://compass-style.org/help/tutorials/spriting/
@import "my-icons/*.png";
@include all-my-icons-sprites;
Будет сгенерировано:
.my-icons-sprite,
.my-icons-delete,
.my-icons-edit,
.my-icons-new,
.my-icons-save { background: url('/images/my-icons-s34fe0604ab.png') no-repeat; }
.my-icons-delete { background-position: 0 0; }
.my-icons-edit { background-position: 0 -32px; }
.my-icons-new { background-position: 0 -64px; }
.my-icons-save { background-position: 0 -96px; }
Если вы видите, что я использую это путь:
Я хочу, чтобы Compass генерировал этот код:
.my-icons-sprite { background: url('/images/my-icons-s34fe0604ab.png') no-repeat; }
.my-icons-delete { background-position: 0 0; }
.my-icons-edit { background-position: 0 -32px; }
.my-icons-new { background-position: 0 -64px; }
.my-icons-save { background-position: 0 -96px; }
В противном случае каждое новое изображение будет добавляться для фон и фоновое положение. Вызывает слишком много селекторов.
Есть ли конфигурация для этого?
Спасибо